Need help

[nouhad]

Hello there.. I've recently started coding CSS and after reading all the articles and tutorials on layout etc I can't quite seem to get my CSS coding looking how I want it to.
What i basically want to do is create a layout that 'stays' how it looks and doesn't expand with text etc.
Thanks

[Reinspire]

Take a look at this link.

http://www.w3schools.com/css/pr_pos_overflow.asp

That should get you started. If you have any questions about it, post away. Also, posting your code, and a link to your site(s) will help you to get faster responses.

[nouhad]

hey there Reinspire, thanks for the prompt reply.
Recently I have been assigned a project to design a site for someone, so i've been trying to start coding from the ground up with a basic layout.
Here is what i have so far

#content {
width: 60%;
margin:1em auto;
border: 1px solid black;
text-align:left;
max-width: 1024px;
background: url('layoutnavbarbg.jpg') top left repeat-y;
}
#sidebar {
float: left;
width: 200px;
margin:0; padding:0;
}
#sidebar-content {
margin:0; padding: 0.5em 1em;
font-size: 70%;
}
#main {
margin:0 0 0 200px; padding:0;
}
#main-content {
overflow:scroll;
margin:0; padding: 0.5em 1em;
font-size: 100%;
}
hr.cleaner {
clear:both;
height:1px;
margin: -1px 0 0 0; padding:0;
border:none;
visibility: hidden;
}

'Overflow' didn't work for me (scrollbars appeared but) in this case :

#infobox
{
border-top: 1px solid black;
border-left: 1px solid black;
border-right: 1px solid black;
border-bottom: 1px solid black;
text-align:left;
font-size:70%;
padding:2px;
}

How do I make this 'box' size according to its contents? And at the same time, not interfere with other layout elements.