Opened 5 years ago

Closed 4 years ago

Last modified 4 years ago

#11263 closed Bug (expired)

IE8: Merged table cells with width applied not rendering correctly

Reported by: Teresa Monahan Owned by:
Priority: Normal Milestone:
Component: General Version:
Keywords: IBM Cc: Satya Minnekanti, Irina, peter

Description

To reproduce:

  • Open any sample in IE8 and insert a table with 1 row and 2 columns.
  • Use the Cell Properties dialog to set a width of 250px for both table cells.
  • Right click in the first table cell and select Cell -> Merge Right.

Problem: You can already see that the table cell is still only half the width of the table. If you type into it, you will only be able to enter text in the first half of the merged cell - see attached screen capture.

This seems to be a rendering issue and switching to source mode and back fixes the issue. Is there anything that can be done to prevent this from happening in the first place though? This was reported by a customer and source mode is not available in this particular instance so they cannot use this workaround.

Note this seems to be a IE8 specific issue. We cannot reproduce it on IE7, 9, 10 or 11. It happens in both CKEditor v3 and v4.

Attachments (1)

IE8_MergeTableCell.gif (10.2 KB) - added by Teresa Monahan 5 years ago.

Download all attachments as: .zip

Change History (6)

Changed 5 years ago by Teresa Monahan

Attachment: IE8_MergeTableCell.gif added

comment:1 Changed 5 years ago by Jakub Ś

Version: 4.3.1 (GitHub - master)

This looks like IE8 problem. This is happening because table has some width set.

<div style="margin: 20px; border:1px solid black; width:1000px;" contenteditable="true">
<h2>IE8 Rendering issue when table has width</h2>
<table id="parent1" border="1" cellpadding="1" cellspacing="1" style="width: 500px">
	<tbody>
		<tr>
			<td id="a">
				&nbsp;</td>
			<td id="b">
				&nbsp;</td>
		</tr>
	</tbody>
</table>
<script>
window.setTimeout(function(){
var a = document.getElementById('a'), b = document.getElementById('b'), p = window.document.getElementById('parent1');
a.setAttribute("width","250px");
b.setAttribute("width","250px");
p.children[0].children[0].removeChild(b);
},3000);
</script>
</div>

I will need to check if there is some nice native way to reload HTML element.

Last edited 5 years ago by Jakub Ś (previous) (diff)

comment:2 Changed 5 years ago by Piotrek Koszuliński

Status: newpending

I confirm the problem which IE8 has with refreshing the table layout. Perhaps we could find a workaround - some nasty way to force refreshing, but from code and maintainability perspectives we wouldn't want to include it. Question is - how important is this bug for you?

comment:3 Changed 5 years ago by Jakub Ś

@tmonahan is this something critical that you must have?

comment:4 Changed 4 years ago by Jakub Ś

Resolution: expired
Status: pendingclosed

I'm closing this issue as expired.

Guys if this issue is important for you, please let us know and we will reopen this ticket.

comment:5 in reply to:  4 Changed 4 years ago by Satya Minnekanti

Replying to j.swiderski:

I'm closing this issue as expired.

Guys if this issue is important for you, please let us know and we will reopen this ticket.

@j.swiderski This is a customer reported issue and it's still reproducible in IE8 with 4.4.6 buidl. please re-open this and fix it for us. we still support IE8 in many of our products.

Note: See TracTickets for help on using tickets.
© 2003 – 2019 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy