jquery - 如何使两个div之间的差距固定?

标签 jquery html css

在我的页面中,它们是两个 div;代表两行。我想固定这两个 div 之间的间隙,这样当我使用拖放时,拖放的元素会水平移动到下一个元素,而不是垂直移动。 请帮忙 谢谢

<div id="div1" style="background-color:#778899;height:30px;width:1030px;float:left;">
<b>Columns :</b>

<div id="div2" style="background-color:#778899;height:30px;width:1030px;float:left;">
<b>Rows :</b></div>

所以在列 div 中,我使用了 jquery 的 droppable 特性

$('#example-1-2 .sortable-list').sortable({ connectWith: '#example-1-1 .sortable-list' }); 

所以问题是,当我放下一个元素时,被放下的元素会像一列一样添加到另一列之下。但我想要的是,当我放下任何元素时,它应该连接起来并且像一排一样,一个对另一个。列 div 位于行 div 下方。因此,我在问我们是否可以固定两者的大小,然后掉落的元素会像时尚一样连续移动。

最佳答案

在你的情况下,他们可能没有什么问题

1 掉落的元素有 float

解决方案 删除 float

2 掉落的元素有内联

解决方案 给那个元素 Display:block 让它可以爆发

两个 div 的间距不影响其 child 的定位

同时发布您的一些代码,以便我们了解问题出在哪里。 更新 使用 #div1 .sortable-item{display:inline;宽度:20%;

元素显示 block 行为只需要内联元素

关于jquery - 如何使两个div之间的差距固定?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20796464/

相关文章:

javascript - 是否有任何技术或插件来照亮元素(按钮)?

javascript - jQuery 和 CSS :before

html - 如何在没有复制设置的情况下在 2 个类中应用这些 CSS?

javascript - 在一个 HTML 页面中输入值,其他 html 页面会动态显示该值,无需每次都重新输入值

html - Bootstrap中元素的位置

javascript - 在javascript中将html表转换为多维数组

javascript - 如何删除 fullPage.js 中的浅色主体?

html - 样式禁用 <select multiple> 控件

html - 悬停时菜单项移动

html - z-index 与 <object> : is there any reason why this doesnt work on majors browser?(Firefox 除外)