I'm working on a new site design and I've hit a brick wall with a problem I'm getting with Firefox.
Bolied down to the essentials there are two columns of text. at the base of these I have a clearing div
Code:
div.Clear { /* clear various browser errors */
clear: both;
background: transparent;
height: 1px;
width: 100%;
}
Which should then force any remaining divs below the the longest column of text.
The trouble is when the right hand column is longer, Firefox just overflows the text over the divs below the columns.
The actual site is a bit more complex than the above description - you can see it in action in a test area:
http://www.allman.uk.net/ictpm/index.php
The above page validates as XHTML strict, and the CSS validates, with warnings, too.
Some notes on the layout can be found here (I don't guarantee this page validates!):
http://www.allman.uk.net/ictpm/notes/notes.php
and the stylesheet is here:
http://www.allman.uk.net/ictpm/styles/general.css
I've been banging my head against this particular problem for around 5 hours, so any help would be most welcome!
Many thanks
Gary
Portsmouth UK