By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,394 Members | 1,912 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,394 IT Pros & Developers. It's quick & easy.

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

P: n/a
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
Share this Question
Share on Google+
1 Reply


P: n/a
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.