Question

我正在使用以下HTML代码。以下是我想要实现的目标：我希望父DIV采用其子DIV的“最长”宽度的宽度。如果您查看下面的HTML代码段＃1，它可以正常工作，但如果您查看HTML代码段＃2，您将看到“测试标题”边框没有根据其最长的DIV宽度更改其DIV宽度孩子DIV。请提供任何指示。感谢。

<!-- HTML code segment#1 --> 
<html>
<body>

<div style="font-family:Arial; fontsize:11px;border-style:solid;border-width:1px;padding:1px;position:absolute;width:auto;" >

<span tyle="padding:1px,7px,1px,7px; background- color:Blue;color:White;position:fixed;height:25px;" >
 <span style="padding:1px,7px,1px,7px;height:25px; middle; text-align: center; padding-top: 2px; font-weight: bold; vertical-align: middle;">

Test Title

</span>

</span>

<div style="margin-top:3px;" >

<p style="padding:2px,1px,2px,1px; margin:0px;">Testing Text1</p>

<p style="padding:2px,1px,2px,1px; margin:0px;">Testing Text2 which is Long</p>         </div>  
 </div>
</body>
</html>


<!-- HTML code segment#2 --> 
<html>
<body>

<div style="font-family:Arial; fontsize:11px;border-style:solid;border-width:1px;padding:1px;position:absolute;width:auto;" >

<span tyle="padding:1px,7px,1px,7px; background- color:Blue;color:White;position:fixed;height:25px;" >
 <span style="padding:1px,7px,1px,7px;height:25px; middle; text-align: center; padding-top: 2px; font-weight: bold; vertical-align: middle;">

Test Title

</span>

</span>

<div style="margin-top:3px;" >

<p style="padding:2px,1px,2px,1px; margin:0px;">Testing Text1</p>

<p style="padding:2px,1px,2px,1px; margin:0px;">Testing Text2 which is Longggggggggggggggggggggggggggggggggggggggggggggggggggggg</p>         </div>  
 </div>
</body>
</html>

Answer 1

将父div的最大宽度设置为最长子div的最小宽度。

如何同时和动态地限制Child DIV和Parent DIV的宽度

1 个答案: