Recent Topics
  1. b2evolution CMS Support Forums
  2. b2evolution Support
  3. Templates, skins, XHTML and CSS
  4. Background image remains fixed.

Background image remains fixed.

1 Jan 26, 2017 16:05    

Ok, working on a template and ran across an odd problem. I pulled the starter master skin to start from, figured that since the code has gotten a lot more advanced, it would be better if I worked with a good base. Problem is, the background image is fixed and I can't find what's causing it. The basic HTML template I made for myself to make sure all the elements work well together scrolls fine, but when I start converting it to a b2evo template, the background image is now fixed. I've switched the code in the header file so that it pulls the css for that skin after it pulls the others, and made sure I set the background to scroll in that css file, but it still won't scroll. Can anyone tell me what I need to adjust to fix this? All the other elements I'm able to start getting into place except for that.

Here's what it's supposed to look like: http://www.dubird.net/testskin/index.html

Here's what it's doing: http://dubird.net/index.php?blog=24&tempskin=testgraphic
(The elements are hard coded for now to make sure I can get them in the right place, then I'll start replacing them one by one to make sure I'm getting it right. Convoluted, I know, but I'm trying to do this properly instead of just hacking something together.)

I know my coding isn't the best, but I can't figure out why it's working on the basic HTML, but not when I use the b2evo header and footer.

Back to top

2 Jan 26, 2017 17:00

Hi @dubird ,
I find the problem is caused by the css file bootstrap-b2evo_base.bmin.css,for the css definition:

body, html {
    overflow-x: hidden !important; /* caused by this line */
}

So you can redefinition it by adding a css line in the tag body of your style.css , just like this:

body {
    /*other elements here*/
    overflow-x: visible !important; /* we add this line to cover  the previous definition, although I really don't know what the meaning of overflow-x: visible, it just works. Maybe you can have try another attribute.*/
}

Have a try.

Back to top

3 Jan 26, 2017 17:38

Yes that worked. Thank you!

Back to top


Form is loading...