On Sunday, June 20, 2004, at 04:37 AM, Roger Williams wrote:
When the browser is reduced in width to less than 800px the middle
content gets shoved down.
If the browser is wider then everything is fine.
OK, on closer observation:
Safari 1.0.2: the #middle div doesn't get shoved down; a horizontal
scrollbar appears at 795px width or less.
IE5.2: acquires a horizontal scrollbar at 698px; #middle div shrinks in
width to a minimum of the longest word contained within it, #pagetitle
image overlaps with right column, until eventually, at 370 px width,
the #middle div drops below the two floated columns.
Seems that IE doesn't honour 'min-width'. For the 'correct' approach,
suggest you check out one of the many online resources on floats (and
clears); I think that your standard 'header, 3 column, left and right
floated' layout is suffereing because of the pagetitle img. This
floated layout always points out that a long element (word, image, URL
etc) will break the layout. Try
http://www.macedition.com/cb/ie5macbugs/ for starters. Or, try
absolute positioning for your L and R columns instead of floats.
A quick fix might be to re-make your gifs so as to place the 'yoga
village' and 'better world' gifs (both blue background) in the #header
div, and let their default (non-overlapping) width define the page's
min-width. Not exactly in the spirit of Standards, I guess, but there
again, as things stand, you effectively have no ID of the page as 'Yoga
Village' if imags are turned off...
Nick
___
Omnivision. Websight.
http://www.omnivision.com.au/
*
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
*
