By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,676 Members | 1,763 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,676 IT Pros & Developers. It's quick & easy.

centering question

P: n/a
Does anyone know how to make a div take the width of what it contains?
NOT the width of what contains it. This is usefull when we don't know
the size of the content in advance. Thank you so much.

Alex
Feb 7 '08 #1
Share this Question
Share on Google+
6 Replies


P: n/a
On 2008-02-07, Alex K <al*********@gmail.comwrote:
Does anyone know how to make a div take the width of what it contains?
NOT the width of what contains it. This is usefull when we don't know
the size of the content in advance. Thank you so much.
Make it float: left (or right), display: table-cell, display: table, or
display: inline-block.

Of those only the first is reliable cross-browser.

Judging by the Subject line your next question is going to be how do I
centre this shrink-to-fit container. Unfortunately if you chose float
you can't.

If you need a centered shrink-to-fit block that also works in IE, the
only option is HTML tables.
Feb 7 '08 #2

P: n/a
In article <sl*********************@bowser.marioworld>,
Ben C <sp******@spam.eggswrote:
On 2008-02-07, Alex K <al*********@gmail.comwrote:
Does anyone know how to make a div take the width of what it contains?
NOT the width of what contains it. This is usefull when we don't know
the size of the content in advance. Thank you so much.

Make it float: left (or right), display: table-cell, display: table, or
display: inline-block.

Of those only the first is reliable cross-browser.

Judging by the Subject line your next question is going to be how do I
centre this shrink-to-fit container. Unfortunately if you chose float
you can't.

If you need a centered shrink-to-fit block that also works in IE, the
only option is HTML tables.
Perhaps OP will benefit from:

<http://netweaver.com.au/alt/shrinkTo...teringShrinkTo
Fit.html>

--
dorayme
Feb 7 '08 #3

P: n/a
dorayme <do************@optusnet.com.auwrote in news:doraymeRidThis-
97*******************@news-vip.optusnet.com.au:

[snip]
>
Perhaps OP will benefit from:

<http://netweaver.com.au/alt/shrinkTo...teringShrinkTo
Fit.html>
Oh is see a mistake. Silly me, what was I thinking when I used inline-box
for IE. It should be inline-block, but I suppose that is the reason I added
zoom:1; to the rule all in an effort to trigger hasLayout.

Now that is done display:inline-box; should be display:inline-block; and
since I don't recall if IE less then 6 needs zoom:1; or not I would leave
that is as well since it's in a conditional comment.

--
BootNic Friday February 8, 2008 11:40 AM
Behind every successful woman...is a basket of dirty laundry.
*Sally Poe*
Feb 8 '08 #4

P: n/a
In article <Xn*********************@bootnic.motzarella.org> ,
BootNic <bo************@gmail.comwrote:
dorayme <do************@optusnet.com.auwrote in news:doraymeRidThis-
97*******************@news-vip.optusnet.com.au:

[snip]

Perhaps OP will benefit from:

<http://netweaver.com.au/alt/shrinkTo...teringShrinkTo
Fit.html>

Oh is see a mistake. Silly me, what was I thinking when I used inline-box
for IE. It should be inline-block, but I suppose that is the reason I added
zoom:1; to the rule all in an effort to trigger hasLayout.

Now that is done display:inline-box; should be display:inline-block; and
since I don't recall if IE less then 6 needs zoom:1; or not I would leave
that is as well since it's in a conditional comment.
I should have picked this one up myself. Perhaps at the time I
regarded anything for IE as like a smelly rat, best left to
professional pest inspectors. That's you, Bootnic!

I have taken the opportunity to add a comment in the source for
the page you refer to. It elevates you in a style that reminds me
of the way Virgil used to describe his characters, especially
heroes. See the Aeneid. You are now "the keen-eyed Bootnic".

<g>

--
dorayme
Feb 8 '08 #5

P: n/a
dorayme <do************@optusnet.com.auwrote in
news:do**********************************@news-vip.optusnet.com.au:
In article <Xn*********************@bootnic.motzarella.org> ,
BootNic <bo************@gmail.comwrote:
>dorayme <do************@optusnet.com.auwrote in
news:doraymeRidThis- 97*******************@news-vip.optusnet.com.au:

[snip]
>
Perhaps OP will benefit from:

<http://netweaver.com.au/alt/shrinkTo...teringShrinkTo
Fit.html>

Oh is see a mistake. Silly me, what was I thinking when I used
inline-box for IE. It should be inline-block, but I suppose that is
the reason I added zoom:1; to the rule all in an effort to trigger
hasLayout.

Now that is done display:inline-box; should be display:inline-block;
and since I don't recall if IE less then 6 needs zoom:1; or not I
would leave that is as well since it's in a conditional comment.

I should have picked this one up myself. Perhaps at the time I
regarded anything for IE as like a smelly rat, best left to
professional pest inspectors. That's you, Bootnic!

I have taken the opportunity to add a comment in the source for
the page you refer to. It elevates you in a style that reminds me
of the way Virgil used to describe his characters, especially
heroes. See the Aeneid. You are now "the keen-eyed Bootnic".
LOL ... Not sure keen-eyed fits, after all it only took 3 months for me
to spot me own mistake.

Now me pants are back up tis time to tuck in me shirt. Tis one more
inline-box that needs to be changed to inline-block. On the URL you
provided that describes my indiscretion.

--
BootNic Friday February 8, 2008 5:46 PM
The only thing wrong with immortality is that it tends to go on
forever.
*Herb Caen*
Feb 8 '08 #6

P: n/a
In article <Xn*********************@bootnic.motzarella.org> ,
BootNic <bo************@gmail.comwrote:
Tis one more
inline-box that needs to be changed to inline-block. On the URL you
provided that describes my indiscretion.
Right, fixed now... was only looking at the demo mark up
before... <g>

--
dorayme
Feb 9 '08 #7

This discussion thread is closed

Replies have been disabled for this discussion.