Wordpress CSS questions

[Fonz]

Hi there,

I'm working on this blog http://www.hairy-pussy-vault.com/blog/ which looks good (well the way I want) in IE but in FF it looks like crap.
As you can see in FF the top navigation bar is completely outlined to the bottom, the left and right border stop where the sidebar stops (I tried adding a background with borders but that didn't look good since it was way outlined.

Does anyone know how to solve these probs. I'll let you lok into my code if you want

Thanx

[jayeff]

It would take a long time to dissect the files if the solution isn't an easy one. But it looks like a height issue for FF.

Try adding clear: both; to the styling of hr, so it becomes:
hr {
display: none;
clear: both;
}

That may be all you need...

[Fonz]

Thanx for responding jayeff but unfortunately the clear: both; thing didn't do much

[jayeff]

What you are seeing is the consequence of a well-documented "feature" of FF in that when you have side-by-side columns it takes the height of the shortest for things such as applying backgrounds. Hence the need for the "faux" background solution you may have come across.

The easier and more elegant solution is the "clear:both" way, but it isn't always obvious where to apply it.

I will have a closer look if I get chance, but I'm quite busy and it usually takes at least a half hour to dissect someone else's files and figure out how it all works. In the meantime you could Google firefox div heights or something like that, for an answer.

[Fonz]

Alright! Thanks for solving these 2 problems jayeff, I couldn't have figured it out on my own.

Anyone who wants to know what was wrong see the article jayeff wrote about it on Carpe Jugular!