gpt4 book ai didi

jquery - 父容器 div 中子 div 的自动宽度

转载 作者:行者123 更新时间:2023-11-28 09:47:27 27 4
gpt4 key购买 nike

我在这个网站上找到了以下 jsfiddle,它 90% 回答了我的查询。

JSFiddle

但是我希望能够在内部 div 上包含边距。我已经尝试修改计算以考虑边距,但如果内部 div 不换行或溢出,我将无法正常工作。

jquery代码是

var containerW = $('.container').width();
var innerCount = $('.container .inner').length;

$('.inner').css({
width: containerW / innerCount
})

html是

<div class='container'>
<div class='inner' style='background : #FF0000;'></div>
<div class='inner' style='background : #00FF00;'></div>
<div class='inner' style='background : #0000FF;'></div>
<div class='inner' style='background : orange;'></div>
</div>

CSS

.container {
width: 100%;
height: 150px;
background : #bbb;
}
.inner {
float:left;
height:100%;
min-width:30px;
}

我只希望能够放置左右边距,以便内部 div 看起来间隔开。

谢谢

最佳答案

如果你像 margin:5px; 这样给 .inner 类留边距,那么试试像

这样的 js
$('.inner').css({
width: (containerW / innerCount)-10
})

因为如果我们给 margin :5px 意味着从左到右它的 5-5 ,那么一个内部 div 的总 10px ,所以我们必须从它的中减去它宽度;

关于jquery - 父容器 div 中子 div 的自动宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25198808/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com