How to limit the width of the Child DIV and Parent DIV simultaneously and dynamically_问答_开发者

How to limit the width of the Child DIV and Parent DIV simultaneously and dynamically

开发者 https://www.devze.com 2022-12-22 02:23 出处：网络

I am using the below HTML code. Below is what I am trying to achieve: I want to parent DIV to take the width of the \'Longest\' width of its child DIV.

相关专题：

I am using the below HTML code. Below is what I am trying to achieve: I want to parent DIV to take the width of the 'Longest' width of its child DIV. If you look at the below HTML code segment#1, it works fine but if you look at HTML code segment #2, you will see that the "Test Title" border did not change its DIV width as per the DIV width of its longest child DIV. Please provide any pointers. Thanks.

<!-- 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 t开发者_如何学运维yle="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>

Set the max width of the parent div to the min width of the longest child div.