DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Snippets has posted 5883 posts at DZone. View Full User Profile

Auto-Sizing DIVs

04.22.2005
| 58715 views |
  • submit to reddit
        To have a <DIV> shrink and enlarge based on its content, use this CSS:

div.autosize { display: table; width: 1px; }
div.autosize > div { display: table-cell; }

In your HTML, enclose the <DIV> you want autosized in another <DIV> with class="autosize"

Before:

<div>
I want this to be auto sized!
</div>

After:

<div class="autosize">
<div>
I want this to be auto sized!
</div>
</div>

Tested in Firefox, Mozilla, Safari, Opera 7, and Internet Explorer 6.