~davidLaakso wrote: >~davidLaakso wrote: > > >>Hawk Shango wrote: >> >> >>>>>>http://www.theempowermentnetwork.org/newsite/default5.htm >>>>>>http://www.theempowermentnetwork.org/newsite/css/TenStyle4.css. This >>>>>>is the base stylesheet. IE specific stylesheet is located in the same >>>>>>folder/directory but is called IE.css >>>>>> Problem is when the page is viewed in Firefox and Opera, >>>>>>it looks >>>>>>fine but when it's viewed in IE, the center div is pushed down. >>>>>>There's a huge space between the header and the center div. I can not >>>>>>find out where in the CSS both the basic stylesheet or the IE >>>>>>specific stylesheet where I messed up. >>>>>> >>>>>> >>>>>> >>Me either. Unless it is that IE is getting mixed messages from the >>method you've used to set the flash block, causing a width and float >>drop problem? Can't help there. Using a content first in source order >>layout <http://www.dlaakso.com/brown-02>, with an image is not >>problematic in IE(at least I don't think so). Perhaps someone else on >>the list can shed some light on this for both of us... >>Regards, >>~davidLaakso >> >> >duh! sorry. ><http://dlaakso.com/brown-02.html> >~dL > > Hi, Quick analysis: in IE, click the mouse in "Special Events", hold mousedown, and go to bottom of the page. Result is this screenshot <http://home.tiscali.nl/developerscorner/css-discuss/images/hawkscreen.gif>. Then out of the blue we see the problem: in IE the content container is having too much width someway. As long the #rightcol is filled (notice 2 empty paragraphs under the line of "Meetings"), the #content doesn't fit between left and right column, and is going down in the same elevator as the height of the #rightcol. Indeed a float drop problem.
In the code, the 3 columns all have a pixel-defined width. Before you know, margin/padding problems in IE are coming. Better is to give one of the columns the freedom to fill the rest of the space: the last one in the html. So if the #content is the last, then no width, but a margin-right to get away under the #rightcol (if this might be shorter). See second screenshot <http://home.tiscali.nl/developerscorner/css-discuss/images/hawkscreen2.gif>. I changed it in the FF-editor, and it's working in FF; perhaps some funetuning is needed for IE. And ... the "content first" method of David is doing it exactly this way: only margins for the content, no width!!! ;-) Cheers, francky ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
