gpt4 book ai didi

html - 如何将父元素的宽度折叠为子元素的总宽度

转载 作者:行者123 更新时间:2023-11-28 12:26:35 25 4
gpt4 key购买 nike

我的父元素宽度占据了父元素的整个 100% 宽度。

相反,我希望父级宽度折叠为子元素的总宽度。

jsfiddle:http://jsfiddle.net/z9Unk/232/

注意红色边框的父元素宽度如何大于绿色子元素的总宽度。我想折叠父宽度。

请告知必要的更改。

HTML

<div class="item1">
<div class="item2">
item2
</div>
<div class="item2">
item2
</div>
</div>

CSS:

.item1 {
position:relative;
white-space: nowrap;
width:auto;
overflow: hidden;
border:2px solid red;
}

.item2 {
position:relative;
display:inline-block;
background-color: green;
width : 255px;
height : 205px;
margin-right:6px;
border:1px solid blue;
}

最佳答案

.item1是一个 block 级元素,默认情况下占据其父级宽度的 100%。

您可以更改 .item1显示类型元素到 tableinline-block :

.item1 {
/* other CSS declarations */
/* display: inline-block; */ /* Or */
display: table;
}

这是 Fiddle .


注意:如果 Internet Explorer 未在兼容性 View 中运行,则没有问题

但是要强制 IE 在标准模式下运行,您可以添加以下 <meta> <head> 中的标签部分:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

更多信息:http://msdn.microsoft.com/en-us/library/cc288325%28VS.85%29.aspx

关于html - 如何将父元素的宽度折叠为子元素的总宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18497625/

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