Hi there,
is there any way to adjust the width of outer div automatically?
e.g.

<div class="outer"><div class="inner">test</div></div>

What I want is that the width of outer could be set automatically according to the content of inner so that I do not have to set the value by myself.

Recommended Answers

Basically, all divs want to be 100% the width of their container unless given a smaller width. So to answer your question, no. But the width of the contents inside the inner div will also have no effect on the width of that div - they will simply run outside …

Jump to Post

Basically, just assign CSS 'overflow:hidden' to the outer div. With this, the outer div will auto size in tern of width and height based on content of inner div without have to set fixed width.

Jump to Post

Are you including the doctype before html?

Jump to Post

All 9 Replies

Basically, all divs want to be 100% the width of their container unless given a smaller width. So to answer your question, no. But the width of the contents inside the inner div will also have no effect on the width of that div - they will simply run outside the container.

Basically, all divs want to be 100% the width of their container unless given a smaller width. So to answer your question, no. But the width of the contents inside the inner div will also have no effect on the width of that div - they will simply run outside the container.

OK, I see. Thanks.

Basically, just assign CSS 'overflow:hidden' to the outer div. With this, the outer div will auto size in tern of width and height based on content of inner div without have to set fixed width.

Basically, just assign CSS 'overflow:hidden' to the outer div. With this, the outer div will auto size in tern of width and height based on content of inner div without have to set fixed width.

It does not work. There is still an empty area shown....

Are you including the doctype before html?

create the div class with "width:auto;"... this will help you
example:
Html:
<div class="outer">.........Document........</div>
css class for div:
outer{
min-width:1024px;
width:auto;
height:auto;
}

Ah, something I hadn't experimented with. Nice new trick.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of 1.20 million developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.