Question

我正在使用Bootstrap的响应式网格布局。我需要调整页面上的一个位置，以便两列之间没有边距;左栏有一个底部边框，我需要将其带到右栏的左边框。

如何扩展div以补偿移除右边界div的左边距？

我能够做的事情：

我可以动态设置左侧div的高度，将底部边框放到我想要的位置：$('#indented_block .border-bottom').height( $('#indented_block').height()-3 );
我可以确定左侧div的原始宽度：$('#indented_block .border-bottom').width()
我可以确定右边div的左边距：$('#indented_block .border-side').css('margin-left');
我可以设置右侧div的左边距：$('#indented_block .border-side').css('margin-left',0);

我无法使用jQuery .width()方法将原始宽度添加到左边距：$('#indented_block .border-bottom').width( $('#indented_block .border-bottom').width()+$('#indented_block .border-side').css('margin-left')); 相反，我无法准确地将这些值加在一起（出于某种原因，上面的行将宽度设置为大约屏幕的宽度）。

我创建了JSFiddle with all the relevant HTML, JS and CSS。

Answer 1

在这种情况下，$('#indented_block .border-side')的{{1}}和.outerWidth(true)之间的差异是.outerWidth(true)可以使用的单位中的左边距。

所以我使用这个jQuery修复它：

.width()

请参阅this working example。

如何扩展div以补偿移除边界div的边际？

1 个答案: