Ticket #748 (new Bug)

Opened 16 months ago

Last modified 8 months ago

[IE] Contents of div with styled width wrap incorrectly

Reported by: severy@… Owned by:
Priority: Normal Milestone:
Component: General Version: SVN
Keywords: SF Confirmed IE Cc: fredck

Description

If two or more images of a fixed width are included in a div with a width style set to the exact sum of the width of the images, the last image will wrap around to a new line in the editor (it does not wrap outside of the editor). If the div width style is set to one pixel more than the exact sum of the width of the images, the wrap does not occur. So it appears that an extra invisible pixel is being added somewhere in the editor. This problem only occurs in Internet Explorer. If a "width=" attribute is used in the div tag instead, the problem does not occur. The same problem happens with <td> tags (when the editor table borders are turned off). The following HTML will demonstrate the problem: 

<html>
<head>
<Title>FCKeditor Table Layout Issue</title>
</head>
<body bgcolor="#0000FF">
<table width="100%" height="50" border="0"
cellpadding="0" cellspacing="0" bgcolor="#FF0000">
<tr height="50">
<td width="100%" height="50">
<table width="100%" height="50" border="0"
cellpadding="0" cellspacing="0">
<tr><td bgcolor="#00FF00"
width="100%"></td></tr>
</table>
</td>
</tr>
</table>
</body>
</html>

Moved from SF:
http://sourceforge.net/tracker/index.php?func=detail&aid=1511439&group_id=75348&atid=543653

Change History

Changed 16 months ago by martinkou

  • cc fredck added
  • reporter changed from martinkou to severy@…

I don't see much chance of fixing this one. Actually IE is "reserving" that pixel for the text input caret when in edit mode, while in ready only mode it is not necessary. This is something done internally by IE and we can't avoid it.

The only solution is to tell IE that you don't want it to wrap, by adding "white-space: nowrap" to the style of the DIV.

Moved from SF. Original poster: fredck

Oops, I attached the wrong sample HTML, the correct sample HTML is as follows: 

<head>
<title>FCKeditor Extra Pixel Issue</title>
<base href="http://www.peopleroa.com"></head>
<body>
<div style="width: 260px;"><img 
src="http://www.peopleroa.com/images/menu_products_off.gif" 
width="130"
                  height="25" border="0"><img 
src="http://www.peopleroa.com/images/menu_solutions_off.gif"
                  width="130" height="25" border="0"></div>
</body>
</html>

Moved from SF. Original poster: severy

Changed 8 months ago by w.olchawa

  • keywords Confirmed IE added
  • version set to SVN
  • summary changed from Contents of div with styled width wrap incorrectly to [IE] Contents of div with styled width wrap incorrectly

Confirmed using IE. Work with FF2.

Note: See TracTickets for help on using tickets.