How to make image positionning css valide

Hello,

I juste want to give tricks about problems i figured out
If you want to have style and margin + height + width instead of vspace and hspace which are depreciated
You just have to edit the "fck_image.js" and modify the "function UpdateImage( e, skipId )"

SetAttribute( e, "_fcksavedurl", GetE('txtUrl').value ) ;
   SetAttribute( e, "alt"   , GetE('txtAlt').value ) ;
   //SetAttribute( e, "width" , GetE('txtWidth').value ) ;
   //SetAttribute( e, "height", GetE('txtHeight').value ) ;
   //SetAttribute( e, "vspace", GetE('txtVSpace').value ) ;
   //SetAttribute( e, "hspace", GetE('txtHSpace').value ) ;
   //SetAttribute( e, "border", GetE('txtBorder').value ) ;
   //SetAttribute( e, "align" , GetE('cmbAlign').value ) ;

get the values

var txtvspace = GetE('txtVSpace').value;
   var txthspace = GetE('txtHSpace').value;
   var txtwidth = GetE('txtWidth').value;
   var txtheight = GetE('txtHeight').value;
   var txtborder = GetE('txtBorder').value;
   var txtfloat = GetE('cmbAlign').value;

put only one line ( for IE and another for firefox )

if ( oEditor.FCKBrowserInfo.IsIE )
   {
      e.className = GetE('txtAttClasses').value ;
      //e.style.cssText = GetE('txtAttStyle').value ;
      e.style.setAttribute("cssText", "margin:"+txtvspace+"px "+txthspace+"px "+txtvspace+"px "+txthspace+"px;height:"+txtheight+"px;width:"+txtwidth+"px;float:"+txtfloat+";");
   }
   else
   {
      SetAttribute( e, 'class'   , GetE('txtAttClasses').value ) ;
      //SetAttribute( e, 'style', GetE('txtAttStyle').value ) ;
      SetAttribute( e, 'style', "margin:"+txtvspace+"px "+txthspace+"px "+txtvspace+"px "+txthspace+"px;height:"+txtheight+"px;width:"+txtwidth+"px;float:"+txtfloat+";") ;
   }

thats it

If you edit fckeditor js files pass attention to clean your cache for every change

Fri, 07/31/2009 - 01:03

debi(li)aner

Joined: 31/07/2009

Posts: 1

Re: How to make image positionning css valide

hey, thank you for this guide, it helped me a lot!

there's only one last question for me:

image-tags are now equipped with css-style-margin-attributes instead of v- and hspace...ok

BUT, if i then use the context-menu to edit image-properties, margin and align-data are not loaded into the input fields in the image-properties-window.
i have no clue what i have to edit in fck_image.js to resolve the problem, maybe you (anybody else here) had the same problem and were/was able to solve it.

thx in advance!