blog css puts main content at the bottom of the window

Sunday 01 February 2004 11:37:38 am

using IE 6.0.2800 in windows XP.

The css setup for the blog design forces all main content to the bottom of the page. It appears as though the left menu extends out beyond the edge of the main content forcing the main content to appear below it. Has anyone corrected the css for this problem?

I assume I'm not the only one experiencing this. It also appears in the current blog demo at http://demo.ezpublish.no/blog

I tried several resolutions including two monitors wide and the problem persisted. Maybe a fixed css in the user contributions section or a simple reply to this post as to what should be edited. There's a lot of stuff in those css files and it will be hard for me to try and pick out where the problem is created.

Thanks in advance for any help.

working at www.wardnet.com
blogging at www.jamesward.ca

Tuesday 03 February 2004 7:44:43 pm

also using IE 6.0.2800 in windows XP

Same bug occurs in your corporate demo. I can't figure out yet where the bug is in the css. Is it in folder.tpl ? core.css ?

anyway, this is and has been a great cms!

regards.

Wednesday 04 February 2004 7:10:19 am

FYI, the problem is the difference in how the browsers (IE vs. Mozilla vs. Opera) interpret the box model. Specifically, whether or not border, padding and margin should be part of the total width of the box, or added to the width of the box. So, if you have a box that is set to 100 pixels wide with a margin of three pixels, padding of two pixels and a one pixel border one browser will interpret the box as being 106 pixels wide (100 + 3 + 2 + 1), while another will just reduce the amount of room within the box, so there is only 94 pixels for the content to fit into. According to the W3C specs, "[T]he box width is given by the sum of the left and right margins, border, and padding, and the content width." Older versions of Internet Explorer (pre-6.x) and IE 6 (when the doctype is set to Quirks mode) follow the wrong box model (keep it to 100 pixels). Mozilla, Opera and IE 6 (set in Standards mode) implement the correct box model (106 pixels).

The same can be said when using percentages. If you set a nested container to a width of 100% of it's parent and then assign padding, margin, or a border to that inner box it could break. In the case of the eZ publish CSS, it forces the content to wrap below another container.

<b>[More Info]</b>
Box Model: http://www.w3.org/TR/REC-CSS2/box.html
Box Model Hack: http://www.glish.com/css/hacks.asp & http://www.tantek.com/CSS/Examples/boxmodelhack.html

Alex

Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]

<i>When in doubt, clear the cache.</i>

Sunday 08 February 2004 9:16:18 pm

Problem appears to be fixed in 3.3-3. Maybe a little css dif file is in order to show the changes?

working at www.wardnet.com
blogging at www.jamesward.ca