hi everyone,
I'm having problems creating a link for an image that is nested inside a div. actually in FF it works fine, however IE behaves weird.
at first I thought there is a problem somewhere inside the FCK.CreateLink function (fckeditorcode_ie.js or fckeditorcode_gecko.js).
normaly the user selects the image (the resizing dots appear around it), then click the Insert link button, select some link and hit OK. but nothing happens, no link is inserted.
when I inserted a few alert() into the code of the FCK.CreateLink function to see what's happening, I found out that the resizing dots disappear after calling FCK.ExecuteNamedCommand('Unlink'); I tried to fix this but actually not knowing what I'm really doing I achieved nothing.
but what's more confusing and weird - my problem is there only as long as the surrounding DIV is a floating div. when I remove the float from my css (or don't apply the problematic class to the div), inserting a link on the image works fine.
here is some code that will hopefully illustrate what I'm talking about:
I have a template in FCKeditor called "image with description" which inserts these tags (in fcktemplates.xml):
<div class="img_left"> <img /> <div class="img_description">some description</div> </div>
then I have two styles for the div (in fckstyles.xml):
<Style name="image template left" element="div"> <Attribute name="class" value="img_left" /> </Style> <Style name="image template right" element="div"> <Attribute name="class" value="img_right" /> </Style>
and here is some relevant css:
img
{
border: 0px;
}
.img_left
{
float: left;
margin: 0 10px 3px 0;
background-color: #F9F9F9;
}
.img_right
{
float: right;
margin: 0 0 3px 10px;
background-color: #F9F9F9;
}
.img_right img, .img_left img
{
vertical-align: top;
}
.img_description
{
font-size: 11px;
font-family: Tahoma, Arial, Helvetica, sans-serif;
padding: 3px;
background-color: #F9F9F9;
border-bottom: 1px solid #ccc;
}
.img_left div, .img_right div
{
font-size: 10px;
color: #666;
}
so as written earlier, when I remove float:right; (or float:left;) I am able to insert a link on the image. but the problem is that the presentation is obviously different and on top of that, I can't select the div to apply one of my styles on it (from the dropdown in FCKeditor). I also can't select the div whether it is floating or not in FF, but in this case I need it to be working in IE.
please if you have any suggestions how to solve this one let me know. may be a code change, or perhaps a change to my template or css, it doesn't matter as long as the presentation stays approximately the same and the functionality is ensured in IE.
the best I came up with until now is to change my template to something like this:
<div class="img_left"> <a > <img /> </a> <div class="img_description">some description</div> </div>
(inserted the blank <a> tag)
then the insert link is actually a change link button, which works OK. but I can't be sure that some user does not unlink the image and then I'm at the beginning of my problem again.
thanks for reading through this till the end 
help will be much appreciated
thanks a lot,
kincho