Forum Moderators: not2easy

Message Too Old, No Replies

Need some positioning help.

My DIV's are breaking...

         

tonynoriega

3:34 pm on Mar 23, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



my screen looks fine in 1024x768, but when i set my monitor to 800x600 it breaks.

One div is pushed down to the next line and doesnt fit properly....

can anyone help...ive tried everying i can....
what happens is that the welcome bar gets pushed down below the footer...

here are my two styles:

#welcome_bar{
margin-left:450px;
margin-top:75px;
height:200px;
width:550px;
background-color:#442E10;
}

#footer{
height:150px;
width:450px;
background-color:#442E10;
margin-top:125px;
margin-right:550px;
}

an the page code they are on...

<div id="footer">
<div class="announcement"><h1>ANNOUNCEMENTS</h1> Coming Soon!
</div>
</div>

<div id="welcome_bar">
<div class="contact_banner"><img src="images/rocks-
stack.jpg" />&nbsp;&nbsp;&nbsp;<img
src="images/flower.jpg" />&nbsp;&nbsp;&nbsp;<img
src="images/rocks.jpg" />&nbsp;&nbsp;<img src="images/NHM-
logo.jpg" />
</div>
<div class="contact_box"><h1>CONTACT</h1>
T: 208.424.5100 ¦ F: 208.955.3036 ¦ E: <a
href="mailto:me.com</a></div>
</div>

londrum

9:51 pm on Mar 23, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



try changing the widths and margins to percentages instead of pixels.
at the moment you've got stuff like:

width:450px;
margin-right:550px;

on a 1024 size screen that will be fine (because they add up to less than 1024)
but the combined total is more than 800, so on an 800 size screen they won't fit