469,352 Members | 2,057 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,352 developers. It's quick & easy.

CSS equivalent of a repeating 1px-high image for a vertical backgroundstripe?

I'm trying to put a vertical blue stripe with a black border on this
page that will remain colored even if the page is scrolled in the UA.

http://maba.org/new/homeproducts/

As you can see, the stripe is there, but Gecko only draws it for the
initial viewport and chops it off if one scrolls down. MSIE stops
drawing the background color at the end of the last link on the left side.

I've messed around with the stylesheet to no end, and to no avail. Am I
missing something here?

Thanks,
Jordan
Jul 20 '05 #1
1 2231
Jordan Peterson wrote:
I'm trying to put a vertical blue stripe with a black border on this
page that will remain colored even if the page is scrolled in the UA.

http://maba.org/new/homeproducts/
You have way too much markup and CSS. It won't get any better, if you
just add more and more markup.
As you can see, the stripe is there, but Gecko only draws it for the
initial viewport and chops it off if one scrolls down. MSIE stops
drawing the background color at the end of the last link on the left side.
Add this to the end of your CSS, and get rid of div.body-box, as latter
causes collapsing margin thingy you don't want. (and which most likely
doesn't work with IE, and maybe not in Gecko either, so do it anyway...)

body {margin:0;padding:0;background:blue;}

div#main
{
background:#fff;
position:static;
margin-left:141px;
border-left: 2px black solid;
width: 440px
}

Replace blue with correct shade. I have not tested in IE, but you should
get the idea. As you didn't ask about that 1px white stripe, I assumed
you didn't need it to go to down. It is possible too, but a tiny bit more
complicated.
I've messed around with the stylesheet to no end
I can see. You should always save versions, so that when you get the
solution working, you don't need to use hours for removing all
unnecessary styling. There is at least 2 pagefuls of useless CSS.
Am I missing something here?


Lots. You are also using px unit to measure text width. No good, use em
instead.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
I'm looking for work | Etsin työtä
Jul 20 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by dBeav | last post: by
8 posts views Thread by Xucyr | last post: by
reply views Thread by dino07 | last post: by
11 posts views Thread by Christoph Boget | last post: by
4 posts views Thread by Gérard Talbot | last post: by
4 posts views Thread by davyzhang | last post: by
13 posts views Thread by Jon Paal | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by zhoujie | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.