div#container {
float : left;
margin : 0 -200px 0 0;
width : 100%;
}
change -200px to 0px , and 100% to 700px;
then you can make .sidebar wider, to 230px for instance; take the padding-left:1em away, to keep the dotted lne balanced:
div.sidebar {
float : right;
width : 180px;
line height:110%; position: relative;
padding-left : 1em;
border-left : #ccddb8; border-style : dotted;
border-top : none; border-bottom : none;
border-right : none;
}
one more thing …
if you add this to your style.css, you can make your .sidebar 260px wide:
.sidebar ul {padding-left:20px;}
and it still looks balanced (checked in firefox only).
thank you so much you give me faith in this forum!
I will try your tips out now, thanks again.