On 8/19/11 9:39 AM, Ghodmode wrote:
On Sat, Aug 20, 2011 at 12:27 AM, Barry Brevik<[email protected]> wrote:
Is there a way, with css, to make a FORM and a containing DIV hug the
widest form element without specifically dimensioning the widths in
pixels? Out of the box, the form and the div take up all of the
available width in the browser.
Here is a test page demonstrating my dilemma:
http://www.manicreader.com/testpage.html
Use float:left on the DIV#container, then on the element that follows
it, use clear:left.
Couple more suggestions:
#container {
display: table;
margin: 0 auto;
}
Alternatively:
body {
text-align: center;
}
#container {
/* float: left; DELETE */
display: inline-block;
text-align: left;
}
Explanation:
float, tables, and inline-blocks shrink to fit the longest content.
Caveat: IE older than 8 does not apply display: table.
It only applies something like inline-block if you add a separate,
later rule of "display: inline" just for IE 6 - 7.
HTH
--
Cordially,
David
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
