Opened 12 years ago

Last modified 12 years ago

#8894 confirmed Bug

Display:inline-block issue

Reported by: Ashraf Hussain Mazumder Owned by:
Priority: Normal Milestone:
Component: General Version: 3.2.1
Keywords: IE Cc:

Description

<span style="display: inline-block"><a href="/send-now"><img alt="Buy - Global Express" src="sites/default/files/media/buy_button.gif" /></a></span>

Paste the above HTML in source.

While using CK editor in IE, if we select the image and click on the link editor, it looses focus and link is inserted at the beginning of the HTML rather than at the image itself.

This is due to display: inline-block and happens only in IE. Please fix.

Attachments (3)

Display-Inline issue.docx (564.5 KB) - added by Ashraf Hussain Mazumder 12 years ago.
issue shown in the doc
link icon.png (16.5 KB) - added by Ashraf Hussain Mazumder 12 years ago.
Link.png (35.5 KB) - added by Jakub Ś 12 years ago.

Download all attachments as: .zip

Change History (9)

Changed 12 years ago by Ashraf Hussain Mazumder

Attachment: Display-Inline issue.docx added

issue shown in the doc

comment:1 Changed 12 years ago by Ashraf Hussain Mazumder

Can anyone please look into the issue

comment:2 Changed 12 years ago by Jakub Ś

Keywords: IE added; Display:inline-block removed
Status: newconfirmed
Version: 3.2.1

Reproducible in IE6-8 from CKEditor 3.2.1.

Code to start with:

<p>
	test</p>
<p>
	<span style="display: inline-block"><img alt="Buy - Global Express" src="http://192.168.1.100:8080/b.jpg" style="width: 100px; height: 75px" /></span></p>

NOTE: When you click on image and then click Link button all browsers except IE6-8 (IE6-8 till CKE 3.2.1) will produce:

<a href="http://test"><span style="display: inline-block"><img alt="Buy - Global Express" src="http://192.168.1.100:8080/b.jpg" style="width: 100px; height: 75px" /></span></a>

The above is correct but I'm not sure if this is what you wanted.

To get link around img but inside span you have to double-click on the image (right-click or left-click and Image toolbar button will not work. Reported here #8960), go to link tab and set link there.

comment:3 Changed 12 years ago by Ashraf Hussain Mazumder

Not sure if the double click solution works. I tried double clicking on the image, but when I click the link icon, it gives me the same result.

comment:4 Changed 12 years ago by Jakub Ś

when I click the link icon

Link icon? could you tell me what link icon are you talking about?

For m the following works in IE6-8 - double-click on image (image properties dialog gets displayed), click on link tab, enter link, press ok.

Changed 12 years ago by Ashraf Hussain Mazumder

Attachment: link icon.png added

comment:5 Changed 12 years ago by Ashraf Hussain Mazumder

Please find the attachment for link icon

comment:6 Changed 12 years ago by Jakub Ś

No, No, No. With left mouse button double-click on the image inside content area (Don't use any toolbar buttons for that). Image Properties Dialog (not Link Dialog) will open. All you have to do is click on Link tab and set URL (See pic)

Changed 12 years ago by Jakub Ś

Attachment: Link.png added
Note: See TracTickets for help on using tickets.
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy