View Full Version : arghhh.. sidebar height not stretching with page

May 23rd, 2007, 12:30 PM
ye olde sidebar height problems... see: http://inaudible.co.uk/blog/archive/category/crocketts
namely how the sidebar stops as soon as content within it stops. i want it to continue down with the rest of the page.

i did figure out how to do it a while ago (caused a few seperate problems but meh) but i've been trying to figure out how again for hours and i'm not getting anywhere.

code is something like below. i think it's something to do with the position:absolute; part but i've tried numerous things including float: right;, adding extra div clear:both's, etc.. and the best i've got so far a side bar that doesnt appear until after the rest of the page.

can anyone help? thanks.

ps. i've tried with a seperate background image for the whole page and that didn't work either, the image dissapeared behind all other content (wasn't visible at all after page loaded) and i have my doubts as to how well it would work anyway (image needs to align with it's edge against the right side, and while using margins / borders on the main body).

<div id="page">
. <div id="content" class="narrowcolumn">
. . <div id="post">
. . . <div id="entry">
. . . . <img class="alignleft"> entry text
. . . </div>
. . <div id="post">
. . . <div id="entry">
. . . . another entry
. . . </div>
. . </div>
. </div>
. <div id="sidebar">
. </div>

.narrowcolumn .entry, .widecolumn .entry {
padding: 0 5px 0 0;
margin: 0;

img.alignleft {
padding: 0;
margin: 0 7px 2px 0;
display: inline;

padding: 0 0 10px 5px;
position: absolute;
right: 10px;
top: 15px;
width: 145px;
text-align: center;

May 23rd, 2007, 01:20 PM

May 23rd, 2007, 01:43 PM
heh... after 4 hours :rolleyes:

<script type="text/javascript">
onload=function() {

it would be nice not to have to resort to javascript, but can i be bothered spending another 4 hours on it? :p