Franklinjagan / jsplumb

Automatically exported from code.google.com/p/jsplumb
0 stars 0 forks source link

Connection andpoints are shifted toward top when using ui-helper-clearfix in top div #40

Closed GoogleCodeExporter closed 9 years ago

GoogleCodeExporter commented 9 years ago
Hi Simon!
You work is working well, but I have one isse

There is a top toolbar and flowchart div on the page.
Buttons on toolbar are floating buttons and aligned to right.
To force toolbar div height match it contents height I used 
jQuery 'ui-helper-clearfix' css fixer on toolbar.
After that every connection endpoint is shifted to the top

reproducible at least in IE8 and Chrome
see the attaches

Additional information:
same issue when I try to use

<div style="clear: both;"></div>

after last button instead of css trick

Original issue reported on code.google.com by astro64m@googlemail.com on 28 Oct 2010 at 1:28

Attachments:

GoogleCodeExporter commented 9 years ago
jsPlumb uses absolute positioning on the various canvas elements it creates.  
if you supply a container, which in this case is 'flowchart', the container has 
to be position:relative.  add this to your css and the connections are in the 
correct place:

#flowchart { position:relative; }

just for anyone reading through this issue in the future - it has got nothing 
to do with the clearfix stuff on the div at the top of the page.  if you remove 
all those styles the supplied demo page exhibited the same problem.

Original comment by simon.po...@gmail.com on 30 Oct 2010 at 10:57