View Full Version : Javascript rich text editor dropdown lists position bug

05-24-2012, 11:17 PM
Hello all,

I'm trying to integrate a rich text editor on a webpage, but whichever one I use (TinyMCE, CKeditor, MarkItUp), I constantly have a position bug with the dropdown lists. (see picture)


If I look into the js-generated html code with Firebug, I notice the lists are positioned absolute, outside my wrapper, with a top-position of 626px.
If I then measure those pixels from the top of the dropdown box to above, I get exactly to the top of my wrapper, instead of the body.
Although the left position is correctly related to the body.
Everything is positioned relative.
My wrapper has a margin-top, but it makes no difference removing it.

So basically somehow the absolute positioned dropdown lists, outside my wrapper, are still positioned "relative" to my wrapper.

I can adjust the top position of the dropdown lists with Firebug, but I'm unable to do so permanently because those lists aren't DOM-ready. And probably the position will vary on other pages... So I'm stuck.

Any suggestions or solutions?


Ok, the problem does seem to be occuring because of the margin-top of my wrapper.
But how does that affect the absolute-positioned elements outside my wrapper???

I fixed it by giving the body-tag a padding-top, instead of a margin-top on my wrapper.
But I don't see the difference...