I am in the process of designing my first website completely in CSS so I am still very very new to this. I have designed my pages so that excess text will scroll within a div. Most of the pages have little text so there will be no scrolling but the pages which do scroll have a very long scrollbar. I have uploaded a sample at http://www.clearlygreendesign.com/av...ite/about.html
What I have done is created 3 divs for the donation button, the content and the image on the right side. I have floated them so they are lined up properly and I have also added padding to them so that the content or each div doesn't butt up to the navbar. Now I see that the scrolling content area adopts the height dimension of the entire div including the padding I have allocated. I don't want this. I actually only want the scrollbar to align with the heading in the content area. I'm not sure what the best way to do this is. The CSS I am using for the content div is as follows:
#content {
float: left;
width: 367px;
height: 360px;
overflow: auto;
padding: 45px 18px 18px 30px;
}
Is there a way to "tell" the scrollbar to only take on the area which is not padded or is there some trick to do this that I'm unaware of?
Thanks!



Reply With Quote

Bookmarks