Forum Moderators: not2easy
For instance, why does IE take the last 3 letters of the word 'right' in my template and add it to the line underneath?
<snip>
code:
css
body { margin:10px; font-family:verdana,arial; text-align:center; font-weight:400; font-size:100%; background:#fff; color:#4E6A7F; padding:0; }
/* middle row */
#mainBody { width:750px; margin-left:auto; margin-right:auto; }
#leftColumn { float:left; background:#999; width:184; text-align:left; }
#centreColumn { float:left; background:#ccc; width:377; text-align:left; }
#rightColumn { float:left; background:#666; width:189; text-align:left; }
HTML
<body>
<!-- main body -->
<div id="mainBody">
<!-- left column -->
<div id="leftColumn">left</div>
<!-- centre columnt -->
<div id="centreColumn">main</div>
<!-- right column -->
<div id="rightColumn">right</div>
</div>
</body>
This is CSS at it's most basic and IE can't display it properly. It's fine in Mozilla and Opera.
[edited by: engine at 1:18 pm (utc) on Aug. 18, 2005]
[edit reason] No urls, thanks. See TOS [webmasterworld.com] [/edit]
Solution - <br clear="all">
this seems to remove the letters 'ght'.
for example,
<body>
<!-- main body -->
<div id="mainBody">
<!-- left column -->
<div id="leftColumn">left</div>
<!-- centre columnt -->
<div id="centreColumn">main</div>
<!-- right column -->
<div id="rightColumn">right</div>
<br clear="all" />
</div>
</body>
this "bug" is called "Duplicating Characters" Bug but it is actually also part of the hasLayout family [webmasterworld.com] of bugs..
as Robin_reala says removing the comments, or moving them inside the closing </div> elements will fix it, (IE is treating them like whitespace, although it can be triggered by an empty element too) but adding layout (height or width) to one of the elements in an affected layout also fixes it.. which one I can't remember but I think it's usually the clearing element itself!
anyway, glad you found a fix for your problem though.. and Welcome to WebmasterWorld!
Suzy