1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Not a Bug TinyMCE breaking out fluid width style

Discussion in 'Resolved Bug Reports' started by mrGTB, Nov 29, 2011.

  1. mrGTB

    mrGTB Well-Known Member

    I just spotted this while resizing my web browser using the fluid style here. TinyMCE is breaking out the style container box.

    Snap1.jpg
     
  2. Brogan

    Brogan XenForo Moderator Staff Member

    That has been reported several times before and isn't a bug.

    The editor window does not resize.

    You need to refresh the page after resizing.
     
  3. Vincent

    Vincent Well-Known Member

    Are you using the recommended fluid settings?

    I do and see no problem in Chrome :)
     
  4. mrGTB

    mrGTB Well-Known Member

    What do you mean by use "recommended fluid settings"?
     
  5. Vincent

    Vincent Well-Known Member

    Well, I don't know if it's recommended but when setting your style to fluid there's an example given at the bottom of the page :)
    I always used that since other widths caused problems to me.
     
  6. mrGTB

    mrGTB Well-Known Member

    You've lost me? What's this example your talking about? :confused:
     
  7. Vincent

    Vincent Well-Known Member

    Haha nevermind :p
    It's not a bug, I can't help it :D
     
  8. digitalpoint

    digitalpoint Well-Known Member

    Not sure why TinyMCE insists on setting a static width at the time it was initialized, but it's easy enough to work around... just run this JavaScript after TinyMCE is initialized:

    Code:
    $('#ctrl_message_html_tbl').css('width', 'auto')
     
  9. mrGTB

    mrGTB Well-Known Member

    I hope they implement that then, as I class it as being a bug myself breaking the layout like it does. One work around also is not to use a fluid width, use a fixed width instead. But wat you posted looks like a proper fix to solve that problem.

    Another bad thing about it, if you use fluid style and shrink you browser really small, refresh then go to full screen. Your left with LMAO a small text box

    small-tinymce.jpg
     
  10. digitalpoint

    digitalpoint Well-Known Member

    My above hack to fix it is wrong... the width should be 100%. This is what I'm using (fires it after 2 seconds to make sure the editor has had enough time to init itself)...

    Code:
    setTimeout(function() {
    	$('#ctrl_message_html_tbl').css('width', '100%');
    }, 2000);
     
  11. Rockchurch

    Rockchurch New Member

    Rather than calling that every time the page loads, here's code that only fires if the window is resized:

    Code:
    $(window).resize(function () {
         $('#ctrl_message_html_tbl').css('width', '100%');
    });
    
     

Share This Page