I'm trying to move one list item from one side to another. However, it doesn't seem to work. I can move the list items from left to right, but not the other way around. The left side has a float: left in the CSS filesheet. If i remove this, everything seems to work. How can i fix this?
Anyone?
I'm trying to move one list item from one side to another. However, it doesn't seem to work. I can move the list items from left to right, but not the other way around. The left side has a float: left in the CSS filesheet. If i remove this, everything seems to work. How can i fix this?
Anyone?
Share Improve this question edited Feb 28, 2014 at 17:23 Michel Ayres 5,98510 gold badges66 silver badges97 bronze badges asked May 26, 2011 at 11:16 DextyDexty 1,4726 gold badges17 silver badges27 bronze badges 4- what? u can move the items from left to right? – Dexty Commented May 26, 2011 at 11:32
- Yes... Left to right and right to left... Using Chrome... – Sani Huttunen Commented May 26, 2011 at 11:41
- Please don't use URL shorteners here. – Jan Hančič Commented May 26, 2011 at 11:41
- and you can "stack" the items? like move one to another, both ways? doesn't work here (using chrome and ff) – Dexty Commented May 26, 2011 at 11:53
2 Answers
Reset to default 14The problem only partially has to do with your CSS. When you float:left the UL, it doesn't render as a block. The quick fix is to use a standard 'clearfix' paradigm:
#newsLayout ul {display:block;overflow:hidden}
Instead of using float: left in your List1 LI element, use display: inline-block.
For further details, there's an example in jQuery's UI documentation which does more or less exactly what you need.
http://jqueryui.com/demos/sortable/#connect-lists