Connecting Tech Pros Worldwide Help | Site Map

how do I get my div wrapper to expand?

Bob Imperial
Guest
 
Posts: n/a
#1: Mar 30 '07
Hi folks!

In need of some enlightenment here, I'm trying to get my wrapper div
to expand to accommodate height-wise, to whatever content is placed in
it, no luck yet and I realize it's probably something simple, I just
don't see it yet. I have the following:

<div style="width:600px; border:1px solid #999933;"><!-- wrapper -->

<div style="width:150px;float:left;padding-left:4px;">Title</
div><!-- inner div 1 -->
<div style="width:210px; float:left;">Name</div><!-- inner div
2-->
<div style="width:200px; float:left;"Phone:<br /Email:</
div><!-- inner div 3 -->

</div>

What I'm trying to do is copy/paste the 3 inner divs with a <br />
after the 3rd but inside the wrapper, does this make sense?? Any help
would be greatly appreciated!

Bob

Els
Guest
 
Posts: n/a
#2: Mar 30 '07

re: how do I get my div wrapper to expand?


Bob Imperial wrote:
Quote:
Hi folks!
>
In need of some enlightenment here, I'm trying to get my wrapper div
to expand to accommodate height-wise, to whatever content is placed in
it, no luck yet and I realize it's probably something simple, I just
don't see it yet. I have the following:
[snip code with floated elements inside wrapper element]
Quote:
What I'm trying to do is copy/paste the 3 inner divs with a <br />
after the 3rd but inside the wrapper, does this make sense?? Any help
would be greatly appreciated!
It would make sense, if you'd give the <br /style="clear:both;".
The thing is that floated elements don't extend their parent's height.
Personally, I use an empty div with one space inside, with the style
'clear:both;'. This gives me more power over the height of the
'clearing element', as I can't give a <br /any height or other
styling.

Be aware though, that this clearing element, also clears other floats
that may occur earlier in the page's code. So if you have a floated
sidebar for example, and the above mentioned wrapper div is inside the
content column of a page, the bottom of that wrappper div will extend
to below the bottom of the floated sidebar.

--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/
Bob Imperial
Guest
 
Posts: n/a
#3: Mar 30 '07

re: how do I get my div wrapper to expand?


Thanks again! Works like a charm ...
Bob
Quote:
>
It would make sense, if you'd give the <br /style="clear:both;".
The thing is that floated elements don't extend their parent's height.
Personally, I use an empty div with one space inside, with the style
'clear:both;'. This gives me more power over the height of the
'clearing element', as I can't give a <br /any height or other
styling.
>
Be aware though, that this clearing element, also clears other floats
that may occur earlier in the page's code. So if you have a floated
sidebar for example, and the above mentioned wrapper div is inside the
content column of a page, the bottom of that wrappper div will extend
to below the bottom of the floated sidebar.
>
--
Els http://locusmeus.com/
accessible web design: http://locusoptimus.com/

Jim Moe
Guest
 
Posts: n/a
#4: Mar 30 '07

re: how do I get my div wrapper to expand?


Bob Imperial wrote:
Quote:
>
In need of some enlightenment here, I'm trying to get my wrapper div
to expand to accommodate height-wise, to whatever content is placed in
it, no luck yet and I realize it's probably something simple, I just
don't see it yet. I have the following:
>
See <http://www.positioniseverything.net/easyclearing.html>

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Andy Dingley
Guest
 
Posts: n/a
#5: Mar 30 '07

re: how do I get my div wrapper to expand?


On 30 Mar, 15:24, "Bob Imperial" <bimper...@gmail.comwrote:
Quote:
In need of some enlightenment here, I'm trying to get my wrapper div
to expand to accommodate height-wise, to whatever content is placed in
it,
It already is. If you use float, then that element is "taken out of
the flow" and so its container no longer needs to fit around it. It's
deliberate, not a bug.

http://brainjar.com/css/positioning/

Bergamot
Guest
 
Posts: n/a
#6: Mar 30 '07

re: how do I get my div wrapper to expand?


Jim Moe wrote:
Quote:
>
See <http://www.positioniseverything.net/easyclearing.html>
Even easier, I think:
http://www.quirksmode.org/css/clearing.html

Sometimes this isn't a good choice, though, for example if you are using
negative margins.

--
Berg
Closed Thread