我正在寻找在容器div水平排列我的div。我在JQuery网站上发现了一个
example，但这是垂直排序。我想要水平
我想在#sortable Div中进行排序。
请指导我如何以水平的方式转换这个垂直排序。
CSS
<style type="text/css">
#draggable1 { width: 150px; height: 35px; padding: 0.5em; }
#draggable2 { width: 150px; height: 35px; padding: 0.5em; }
#draggable3 { width: 150px; height: 35px; padding: 0.5em; }
#sortable { width: 700px; height: 35px; padding: 0.5em; }
</style>
JavaScript的
<script type="text/javascript">
$(function() {
$("#sortable").sortable({
revert: true
});
});
</script>
HTML
<div class="demo">
<div id="sortable" class="ui-state-default">
<div id = "draggable1" class="ui-state-default">Home</div>
<div id = "draggable2" class="ui-state-default">Contact Us</div>
<div id = "draggable3" class="ui-state-default">FAQs</div>
</div>
</div>
解决方法
您可以添加此CSS样式：
#sortable>div { float: left; }
他们将是水平的，仍然可以排序。 You can see a demo of it in action here。
