Lite förenklat så har jag en div som är 705px bred och 500px hög.
I den har jag två div:ar som är 100% av bredden på den omgivande div:en men har olika höjd beroende på hur mycket text det ligger i den översta div:en, båda måste hålla sig innom den omgivande div:en både i bredd och höjd.

Hmm, lite rörigt det där men jag hoppas det går att förstå.

Hur gör jag? Som det är nu överlappar undre den div:en den övre vilket gör att man bara ser halva texten.

Den exakta koden ser ut som nedan.

<code>

div.content
{
background-color:#ffffff;
margin: 85px 0px 0px 203px;
clear: both;
border-style: solid;
border-width: 1px;
border-color: #000000;
border-left-color: #ffffff;
border-top-color: #ffffff;
padding: 0px 0px 0px 0px;
width: 705px;
height: 500px;
position: absolute;
overflow: off;
z-index: 1;
}

div.toptext
{
margin: -1px 0px 0px 0px;
background-color: #000000;
font-family: Verdana, Helvetica, Arial, Geneva, sans-serif;
font-size: 11;
color: #ffffff;
padding: 10px 4px 4px 10px;
width: 100%;
position: absolute;
z-index: 1;
}

/*Start Boxar - istället för tabeller.*/
div.float
{
float: left;
}

div.float p
{
text-align: center;
}
div.container
{
border: 2px dashed #333;
padding: 4px 4px 4px 4px;
background-color: Transparent;
width: 100%;
height: 95%;
overflow: auto;
position: relative;
z-index: 2;
}

div.spacer
{
clear: both;
}
/*Slut Boxar*/


<div class="content">
<div class="toptext">
Här kan du ladda ner annonser för publicering i tidningar, reklamblad m m.
</div>
<div class="spacer">&nbsp;</div>
<div class="container">
<div class="spacer">
&nbsp;
</div>
<div class="float">
<img src="image1.gif" width="100" height="100" alt="image 1" /><br />
<p>caption 1</p>
</div>
<div class="spacer">
&nbsp;
</div>
</div>
</div>

</code>

Så här?

<style type="text/css">
div.content
{
    background-color:#ffffff;
    margin: 85px 0px 0px 203px;
    clear: both;
    border-style: solid;
    border-width: 1px;
    border-color: #000000;
    border-left-color: #ffffff;
    border-top-color: #ffffff;
    padding: 0px 0px 0px 0px;
    width: 705px;
    height: 500px;
    position: absolute;
    overflow: off;
    z-index: 1;
	background: #fcc;
}

div.toptext
{
    margin: -1px 0px 0px 0px;
    background-color: #000000;
    font-family: Verdana, Helvetica, Arial, Geneva, sans-serif;
    font-size: 11;
    color: #ffffff;
    padding: 10px 4px 4px 10px;
    /*width: 100%;*/
    /*position: absolute;*/
    z-index: 1;
}

/*Start Boxar - istället för tabeller.*/
div.float 
{
    float: left;
}
  
div.float p 
{
    text-align: center;
}
div.container 
{
    border: 2px dashed #333;
    padding: 4px 4px 4px 4px;
    background-color: Transparent;    
    /*width: 100%;*/
    height: 95%;
    overflow: auto;
    /*position: relative;*/
    z-index: 2;
 }

div.spacer 
{
    clear: both;
}
/*Slut Boxar*/
</style>

<div class="content">
	<div class="toptext">
	Här kan du ladda ner annonser för publicering i tidningar, reklamblad m m.
	</div>
	<div class="spacer">&nbsp;</div>
	<div class="container">
		<div class="spacer">
		&nbsp;
		</div>
		<div class="float">
			<img src="image1.gif" width="100" height="100" alt="image 1" /><br />
			<p>caption 1</p>
		</div>
		<div class="spacer">
		&nbsp;
		</div>
	</div>
</div>