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
*****************************************************
