I have a website that uses a combination of Wordpress and plain HTML. On my plain HTML pages, the navigation at the top looks fine at most screen sizes, however on the wordpress parts the ad and navigation links drop down if you make the browser window too small. My question is how do I stop this? I don't mind if it drops down on really small sizes, but I want it to look OK on most screens.

Obviously you can view the source code of the index page (plain HTML). The page is here:
linuxloop.com/index.shtml
and the CSS for that is at:
linuxloop.com/layout2.css

For the wordpress part (the part where I am having trouble) you can go to:
linuxloop.com/sitenews
and view the source there. The CSS I believe is relevant is this, but if you need more, just tell me:

#topnav {
background-image: url('/img/navbar/topnav_bg.jpg');
width: 100%;
height: 159px;
}

#topnav_txt {
/*float: left;
margin-left: 20px;
margin-top: 100px;*/
font-size: 18px;
width: 468px;
font-family: verdana,arial,sans-serif;
}

#titleimg {
float: left;
margin-left: 15px;
margin-top: 20px;
border: 0;
}

#vert_bar {
float: left;
margin-left: 8px;
margin-top: 20px;
border: 0;
}

#topad {
float: left;
margin-left: 10px;
margin-top: 5px;
border: 0px;
font-size: xx-small;
text-align: left;
}

#horiz_bar {
float: left;
margin-left: 0px;
margin-top: 5px;
border: 0px;
}

#home_content {
float: left;
margin-left: 20px;
margin-top: 30px;
width: 500px;
}

This is a picture of how it should look:
http://img175.imageshack.us/img175/5...oopwebssq7.jpg
and this is how it looks with too small a screen:
http://img512.imageshack.us/img512/3...oopwebsuw2.jpg

Thank you very much!

I resized Firefox to 800x600 and it didn't drop down below. I don't thing you would have too many visitors, if any, that used 640x480.

Your logo and and google ads are fixed sizes. The only thing I know of you could do is put a div around the page and make it a fixed size. This would give a 640x480 user a scroll bar. But I don't recommend that.

Thanks. I think I may have figured out what happened. I just upgraded to the beta of Ubuntu Hardy Heron, which comes with Firefox 3 Beta 5. In that version of Firefox, it looks bad at 800 x 600, but on my other computer running Firefox 2 it looks just fine. Should I assume this is just a bug that will be resolved or is it something to worry about?

Thanks again!

Can you post a screenshot? Does FF3 push the ads and menu down? If your concerned how it looks at low resolution, move the Google ads.

http://img512.imageshack.us/img512/3...oopwebsuw2.jpg

I could take out the ad, but I don't think that would fix the problem. I will just wait until Firefox 3 comes out and deal with it then if it is not fixed.

Thanks!

That might be a good idea. I think it is a margin/padding issue but don't want to install FF3 to investigate. You might play with those settings in your topnav and see if that helps.

You don't have to wait to install FF3 - you can test so many browsers here:

http://browsershots.org/

I love this site!

Have fun with it..