Opened 17 years ago
Closed 12 years ago
#748 closed Bug (wontfix)
[IE] Contents of div with styled width wrap incorrectly
| Reported by: | Owned by: | ||
|---|---|---|---|
| Priority: | Normal | Milestone: | |
| Component: | General | Version: | SVN (FCKeditor) - Retired |
| Keywords: | IE | Cc: | Frederico Caldeira Knabben |
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 (5)
comment:1 Changed 17 years ago by
| Cc: | Frederico Caldeira Knabben added |
|---|---|
| Reporter: | changed from Martin Kou to severy@… |
comment:2 Changed 17 years ago by
| Keywords: | Confirmed IE added |
|---|---|
| Summary: | Contents of div with styled width wrap incorrectly → [IE] Contents of div with styled width wrap incorrectly |
| Version: | → SVN |
Confirmed using IE. Work with FF2.
comment:3 Changed 16 years ago by
With more and more web sites using designs with lots of divs, I'm seeing this problem more and more often lately. I tried the suggested "white-space: nowrap" workaround but it doesn't seem to help, and often makes a mess of text within the affected divs.
Does anyone have any links to any official descriptions of this "feature" of IE that I can send to affected clients to explain that there isn't anything I can do?
Has anyone found any other workarounds to this problem?
Does this issue still happen in IE8?
comment:4 Changed 15 years ago by
The same bug occurs in IE with CKEditor 3.0 beta 3667. In FF works fine.
comment:5 Changed 12 years ago by
| Keywords: | SF removed |
|---|---|
| Resolution: | → wontfix |
| Status: | confirmed → closed |
- This issue is only reproducible in IE6 and IE7.
- no-wrap workaround works in both of these browsers
<div style="width: 260px; white-space: nowrap"> <img border="0" height="25" src="http://www.peopleroa.com/images/menu_products_off.gif" width="130" /><img border="0" height="25" src="http://www.peopleroa.com/images/menu_solutions_off.gif" width="130" /></div>
- As explained in comment:1
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
Taking all the above into accout I'm closing this as won't fix.
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