WordPress.org

1. Akram Taghavi-Burris
   Member
   Posted 1 year ago #

   Hello All,
   I've been working on this problem all night and I can not figure out what I'm doing wrong.

   I have a header image and a footer image and they are supposed to extend to the width of the browser (or so I thought since I have a repeat-x attribute set to the background property.

   When the browser is maximized it looks great, but when you re-size the browser or in some cases a browser at a lower resolution, will cause you to scroll horizontally and you discover that the footer and header images are cutting off at a certain point. WHY IS IT DOING THIS and why is it cause some browsers to scroll.

   Here is an image of what it is doing: http://www.akramsideas.com/wp-content/themes/akramsideas_V7/error.png
   (note that the main body image is repeating fine)

   Here is the link to the css: http://www.akramsideas.com/wp-content/themes/akramsideas_V7/style.css

   Please let me know what's wrong.
   PS I know there are other weird errors if you view in IE, but right now I just want to fix these background image errors as they appear in firefox and safari.

   Thank you

2. Akram Taghavi-Burris
   Member
   Posted 1 year ago #

   I have had no replies. However I did find a work around. If you set the main container div to a percentage rather than a pixel size, the backgrounds do go all the way to the end. However the minute you put a pixel size with any div, it freaks out again.

   Another note, that while this works, it can have a weird look on your site. For example my container is set to 75% of the screen, which on my monitor makes the content and sidebar relatively far apart, however on other monitors they will appear closer together.

Topic Closed

This topic has been closed to new replies.