css height help

[ianhaney]

Hi

I have been stuck for a while on this issue

I have a main div with two divs inside it and am trying to get the main and inside divs to expand to fit the content in but am having no joy

for example the home page does not have as much content as my sub page

I have pasted the HTML and CSS below



<div id="container-pages">

<div class="top-point">
<img class="top-point" src="images/top-point-1.png" alt="" title="">
</div>

<div class="bottom-point">
<img class="bottom-point" src="images/bottom-point-.png" alt="" title="">
</div>

</div>


CSS



#container-pages {
background: #598288;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom-left-radius: 30px;
border-bottom-right-radius: 30px;
height: 835px;
width: 957px;
margin: 150px 21px 0 23px;
}

.top-point {
margin: -92px 0 0 200px;
}

img.top-point {
margin: -71.6px 0 0 182px;
position: absolute;
height: 80px;
}

.bottom-point {
margin: 460px 0 0 200px;
}

img.bottom-point {
margin: 54.6px 0 0 -440px;
position: absolute;
height: 80px;
}


Thank you in advance

Kind regards

Ian

[Beverleyh]

Its hard to visualise what you're asking without examples. You refer to "content", but there is no content to illustrate any behaviour. Also, "having no joy" is unfortunately not descriptive enough - we need to see examples of what is actually happening, and for you to clearly describe what you want or expect to happen instead.

At the moment we cannot clearly see in what div the content is placed (apart from 2 images - is this the only content?).

If you mean that you want the heights of these 3 divs to increase so that they accommodate whatever else is put inside them, while still falling back to a minimum height, you can use min-height instead of height in your CSS.

Looking at the CSS, I'd be tempted to say that just changing height:835px; to min-height:835px; is what you need, but if this isn't the case, please provide links to the actual pages and try to explain your requirements in more detail.

[ianhaney]

Hi

Thank you for the reply

I have solved it now by adding min-height to the container-pages div