Width auto not working

HTML & CSS
1

hey folks,
my width of a background color isn’t working. i want it auto where the text end it should end but its not applying. what am i doing wrong?

<style type="text/css">
.plc{background:#d5e6f0; border:1px #0064a2 solid; width:auto; }
</style>

<div class="plc">Hello world</div>
2

Do you want the <div> to end where the text ends, or just the background color?

If the first, try this:


.plc{background:#d5e6f0; border:1px #0064a2 solid; [COLOR="Red"]float:left;[/COLOR] }
3

Thanks buddy i wanted the first one. but why wasn’t it wrapping itself against where text ended? doesn’t width:auto means that?

4

No. See here:

“For static or (relatively positioned) elements … an element whose width is set to auto will expand to fill the parent without our needing to set a specific width such as width:100%.”

5

now i run into another problem. if i use float the white div doesn’t expand with data and the lower corners comes up http://ammardesigns.com/sandbox/dummy2.php
but if i don’t use float its ok http://ammardesigns.com/sandbox/dummy.php but i want in some pages to div to wrap around the each table and in some extend to end. what to do?

6

Hi, width:auto on a block element means it will go as far as iit can, on an inline element it will stop where the content ends.

And the white block needs a clearing mechanism, so give it overflow:hidden;
.telecompass{overflow:hidden;}