This must be a descriptive post as FTP problems prevent me from posting a live
site to check.
I have a web page with a 1280x1024 background picture set to repeat. If a
user's screen is smaller, they won't see a difference and if larger, they'll
only see repeating around the edges.
When the central content area holds a menu list with only text entries, even
though the window is scrolled to view the entire page, the background remains
in place. Note that the menu has not extended past the boundaries of the
background picture.
If pictures are added to the menu rows, causing the central content area to
extend past the background boundaries and hence cause background repeats, the
background picture shifts downward, with a section of the upper picture at
the top then the entire background then a portion of the lower picture. Very
choppy and ugly.
The following css definitions modify the page:
img.displayed
{ display: block;
margin-left: auto;
margin-right: auto }
body
{ background-image: url('yoni-modded.jpg');
background-repeat: repeat;
background-position: center center;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0; }
#header
{ padding-left: 2%;
padding-right: 2%;
position: float; }
#contentarea
{ clear: both;
padding-left: 5%;
padding-right: 5%; }
The menu is located within the contentarea, so my first thought is that my div
are defined wrongly. Why would a background picture overflow by the
contentarea cause such a problem?
If anyone can make a picture out of my words and recommend any changes, I am
indebted.
Thanks, Bob
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
