div within a div

angyl · 10-20-2005, 12:57 AM

I have a parent div layer that has borders. On one of my pages the only thing inside this div is other divs. The sub-divs position themselves beautifully in relation to the parent div even with 'position:absolute' but because I'm using 'position:absolute' the parent isn't recognizing them or something and the border never expands to envelope them. I can't use 'position:relative' because there are sometimes 40 or more divs and when I use 'position:relative' they all get relative to each other and never end up in the right place.

How do I get the parent div to expand it's borders around them?

vinyl-junkie · 10-20-2005, 02:29 AM

It would be much easier to help you if you'd post your code.

TheShaner · 10-20-2005, 03:36 AM

I'm still new to CSS, but from what I've read, don't use either of those positions. Try using the default position - position: normal;

Here's a good site to read for the theory of box elements and positions. I think this article will really help you with your question:

http://www.brainjar.com/css/positioning/default.asp

-Shane

ronaldb66 · 10-20-2005, 10:43 AM

An absolutely positioned element is taken out of the normal flow and hence won't have any influence on its parent; the outer div collapsing is the proper behaviour.

Without knowing what layout you wish to create it's near impossible to say anything conclusive, but judging by the term "layer" you're using DW to auto-generate an all abs pos based layout.
Better take the helm yourself and steer clear of DW's "table-cells-replaced-by-abs-pos'd-divs" layout nightmares; learn how to apply CSS positioning to create layouts yourself.

Absolute positioning has powerful possibilities, but should be used judiciously with a solid understanding of the implications of its use.

angyl · 10-20-2005, 06:43 PM

I tried the position:normal but it doesn't listen when I define the top and left elements. I read the article and realized I don't think I'm going to be able to do what I want the way I have in the past.

Quote:

Originally Posted by ronaldb66

Better take the helm yourself and steer clear of DW's "table-cells-replaced-by-abs-pos'd-divs" layout nightmares; learn how to apply CSS positioning to create layouts yourself.

I do absolutely position certain elements of my layouts - I figure mostly because I'm a control freak. But not often as a replacement for table cells. Except in this case that's what I'm doing. I didn't include the code earlier because it's a nightmare reagardless of any positioning.

Code:

<body>
<div id="divControl">
<div class="11"><a href="#" onclick="changeActive(0)">
<IMG src="ab-caught.jpg" width="50" height="50" BORDER=0></A></div>
<div class="12"><a href="#" onclick="changeActive(21)">
<IMG src="a-blue.jpg" width="50" height="50" BORDER=0></A></div>
</div>

<div id="ab-caught" class="pic">
  <IMG src="ab-caught.jpg" width="225" height="305"></div>
<div id="a-blue" class="pic">
  <IMG src="a-blue.jpg" width="225" height="307"></div>
</body>

Code:

.pic {position:absolute; top:25px; left:5px; width:225px; visibility: hidden}
.11 {position:absolute; top:10px; left:260px}
.12 {position:absolute; top:10px; left:330px}

Then the javascript I didn't include uses the small images as a menu to change the layer of the class="pic" images.

Are there other CSS positioning could I use to achieve the same effect?

ronaldb66 · 10-21-2005, 07:11 AM

It would really help if you could make the page in question available online: without seeing the actual images and the sort of effect you wish to achieve, it's hard to suggest anything useful.
If you are unable or unwilling to expose the page online, at least make a screen capture of the section at hand so we can SEE it.

angyl · 10-21-2005, 04:52 PM

Yeah - here's that page:

http://www.eidolon-solstice.net/magn...=Elijah%20Wood

effpeetee · 06-30-2008, 04:33 PM

Have a look at this here

or this-

or even this.

Oodles of pictures.

Might be helpful.

Frank.