|
James Ward
|
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
|
|
Badrulhisham Bahadzor
|
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.
|
|
Badrulhisham Bahadzor
|
Wednesday 04 February 2004 12:24:36 am
Setting width to 99% instead of 100% corrected the problem. I still haven't fully understand the css, but for the time being this seems to solve the problem.
CORE.CSS
div#innercontent
{
display: table; /* This style is needed as a fix for an Opera "bug" */
width: 99%;
} regards.
|
|
Alex Jones
|
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>
|
|
James Ward
|
Sunday 08 February 2004 8:33:09 pm
Badrulhisham - Your solution did not solve the problem in my browsers. Thanks for the attempt though. Alex - Thank you for the explanation of the problem. This should help in searching for a solution. I am still looking for a solution. There is a lot going on in these css files and its no easy task for someone who did not take part in their creation to find the offensive line. If there is a fix prepared eZ Crew please post it or a link to it here.
working at www.wardnet.com
blogging at www.jamesward.ca
|
|
Alex Jones
|
Monday 09 February 2004 7:27:24 am
James, I think Badrulhisham was close, but the width should probably be set around 98%. If nothing els, set it to 96% and work on up. I tested this previously and it fixed the problem. I do not know what changes eZ systems made in the CSS for 3.3 though. Alex
Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]
<i>When in doubt, clear the cache.</i>
|