一个元素的动态宽度取决于元素的宽度
问题描述:
我有两个元素通过左右浮动而彼此相邻。 right元素宽度通过填充动态增加或减少的子元素来动态变化!但左元素是一个简单的DIV。我希望它的宽度根据右侧的元素宽度进行更改。如何通过CSS来完成?一个元素的动态宽度取决于元素的宽度
例如:
<div style="float:left"></div>
<div style="float:right;padding:5px 10px;">
<a>child1</a>
<a>child2</a>
<a>child3</a>
</div>
答
我不是100%肯定你想什么来实现的,但如果我的理解对不对:
- 您在至极,你是浮动的
right
有一个面积A元素与3个孩子 - 其余区域A要填写
left
元素
这是正确的吗?
那么最简单的方法是在right
元素周围包围一个inline-block
元素,表示整个A区域和right
元素浮动在此父元素的右侧。然后,您分配给父项的所有属性都将代表right
元素未涵盖的区域A.例如背景色:
<div style="display:inline-block; width:100%; background-color:blue;">
<div style="float:right; right:0; padding:5px 10px; background-color:yellow;">
<a>child1</a>
<a>child2</a>
<a>child3</a>
</div>
</div>
结果