How do I: Div element outside of body.

[Xcynic]

So, I'm trying to create a topmenu that should stretch the full width of the page, but since it's being affected by the doc width (fixed) it wont expand to full width.

How would I get the div to properly expand the full width of the page?

Thanks.

[LifesGreatestGift]

your best bet is to make the entire document 100% width with margin:0 auto; and manually set the main elements .above_body,.body_wrapper,.below_body (i think theres another one) to a fixed width. That way you don't have to mess with absolute positioning and having to margin all the elements down the height of the 'topmenu'.

[Xcynic]

Thank you for your response but wont that look really bad for users with small monitors? For example if I set the doc width to 100% and the body_wrapper and the other main elements to 1000px, wont it look weird for people with small monitors/phones etc?

[LifesGreatestGift]

Well, it would be similar to your current setup i would imagine. what is your current body_wrapper width? If its 1000px most smaller monitors will show a horizonal scroll if you are not using overflow:hidden;

you could always make it fluid

body_wrapper width:100%

other elements 80% with a min-width of 650px or something. and the top bar being 100%

you should also set a max-width of like 1000px on the 'other elements' as people with larger monitors, it is annoying to read posts that stretch too far.

[Xcynic]

Yea, it's currently 1000px which as you say will still give smaller monitors a horizontal scroll unless I use overflow:hidden;.

But I guess I'll take your first advice and set doc_width to 100% and manually set the main elements to the width I want, this way the top_menu will stretch the full width of the screen.

Thanks!

[LifesGreatestGift]

sounds good. its not usually recommended to use overflow:hidden; as if you have important content past the 'scroll' it will be cut off and unable to be scrolled to.

[Xcynic]

Yea, might not use it, we'll see. Atleast for now the width issue is fixed. Thanks a ton for your help!

[LifesGreatestGift]

no problem. care to show your site?

[Xcynic]

<a href="http://x-productions.com/forum/forum.php" target="_blank">http://x-productions.com/forum/forum.php</a>

As you can see, still a WIP.

[LifesGreatestGift]

digging the style. maybe brighten up the color of the font just a tad closer to white. I like the slider you appear to be implementing. Nice site.

[Xcynic]

Yea, I probably will, a bit to grey at the moment. I just do this normally when I code designs that I put everything in basically the same color so I can see everything without anything jumping out until the entity is coded. Then I mess around with colors and details.

Thanks!