3 Replies Latest reply on Feb 4, 2009 10:45 AM by rsoika

    rich:editor - width can not be set to 100%

    rsoika

      Hi,

      direct TinyMCE support is a great new feature in RichFaces - Thanks a lot!

      But I run into a problem when I try to set the with to "100%".
      The attribute "width" can only be set to an integer value. So "100%" is not allowed here. Only absolute values. But my form supports a flexible width. So I want to set also the width of the rich:editor component to an percental value.

      I tried to overwrite the classes
      .richfacesSkin table.mceLayout
      .table.mceLayout
      .mceLayout

      And also I tried to define my own styleclass - but all with no effect.
      The component finally overwrites the width an hight attribute if you did not set it to absolute values.

      Has anybody a solution for this problem?

      thanks
      ralph

        • 1. Re: rich:editor - width can not be set to 100%
          ilya_shaikovsky

          all such issues should be revealed at TinyMCE wiki. Because we changed nothing in their scripts. Only pack this as component, added skinning and server side SeamText support :) All styling and customization properties works fully the same as for original widget.

          • 2. Re: rich:editor - width can not be set to 100%
            rsoika

            Hi,

            thanks for reply.
            What I mean is the fact that the TinyMCE is placed into a table tag with the following html code fragment:

            <table id="j_id104:default_form:details_idTextArea_tbl" class="mceLayout" cellspacing="0" cellpadding="0" style="width: 222px; height: 260px;">
            


            • 3. Re: rich:editor - width can not be set to 100%
              rsoika

              Hi,

              sorry your are right!
              It was my fault.
              It is no problem to modify the width using the f:param tag.
              This is the code I am now using and it works well :-)

               <rich:editor id="details_id" theme="advanced"
               plugins="fullscreen" value="#{workitemMB.item['htmldetail']}">
               <f:param name="theme_advanced_toolbar_location" value="top" />
               <f:param name="theme_advanced_toolbar_align" value="left" />
               <f:param name="width" value="95%" />
               <f:param name="height" value="260" />
              
               </rich:editor>