Any Css Specialists Here?

[mrdee 1]

Hello,

 

I have redesigned my website and used Adobe Dreamweaver to do it.

 

I chose for a two-column design with body, left sidebar and a header and a footer.

 

The model I used was one that came with Dreamweaver.

 

However, the problem I have is that, on pages with a lot of content in the body, the sidebar stops far from the footer, and if I set the "height" value of the footer too high in the CSS stylesheet, it leaves the body container with a lot of white space underneath the contents.

 

I have tried everything, I set "height" to "auto" in the stylesheet, then tried to set it to 100%, but none of that made any difference.

 

I have, so far, come up with a "very clumsy" solution, but at least it does the trick:

 

I filled the empty space after the last item in the sidebar with "<br>" tags.

 

I know, very clumsy and probably unprofessional, but it does do the trick so far.

 

Here is the CSS for the pages:

.sidebar1 {	float: left;	width: 180px;	background-color: #0CC;	padding-bottom: 10px;	height: 100%;}

And this is the HTML:

  <div class="sidebar1">    <ul id="MenuBar1" class="MenuBarVertical">      <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/" title="Naar huis" target="_self">Naar huis</a>              </li>      <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/" title="Gastenboek" target="_self">Gastenboek</a></li>      <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/" title="Over ons" target="_self">Over ons</a>       <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/" title="Contacteer ons" target="_self">Contacteer ons</a></li>            <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/" title="Verwijzingen" target="_self">Verwijzingen</a></li>            <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/" title="Verzoekjes" target="_self" class="MenuBarItemSubmenu">Verzoekjes</a>        <ul>          <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/">Gewoon</a></li>          <li><a href="http://forums.xisto.com/">Zoekmachine</a></li>        </ul>      </li>            <li><a href="http://forums.xisto.com/" title="Mededelingen" target="_self">Muziekkeuze</a></li>            <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/" title="Word lid" target="_self">Word lid</a></li>            <li><a href="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/" title="Luister in nieuw venster" target=""popup" onClick="wopen('speelblad.htm', 'popup', 640, 480); return false;"">Luister in nieuw venster</a></li>    </ul><p><a href="https://twitter.com/intent/tweet?url=&original_referer=" class="twitter-share-button" data-via="RadioVlNationaa" data-lang="nl">Tweeten</a><br></p><p>U kunt ons station nu ook beluisteren op uw Android of Blackberry. Klik hieronder om binnen te halen:<br>Dit is tans ook moontlik om op u Blackberry of Android na ons stasie te luister, kliek op die  gewenste knoppieom die toepassing af te laai:<br><a href="http://www.nobexrc.com/Download.aspx" target="_blank"><img src="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/404.png" width="120" height="50" alt="" title="" border="0" /></a> <br /><a href="https://play.google.com/store/apps/details?id=com.nobexinc.rc" target="_blank"><img src="http://forums.xisto.com/no_longer_exists/'>http://forums.xisto.com/no_longer_exists/404.png" width="120" height="50" alt="" title="" border="0" /></a> </p><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />  <!-- end .sidebar1 --></div>

You ca n see the "filling up" with "<br>" tags, but in my despair, that was all I could come up with.

 

I also noticed that I am not the only one struggling with this issue, as a Google search showed me many people asking about it, but I have so far not found one suitable solution.

 

I basically want the sidebar to expand as content is added to the body of the site.

 

If possible, could it be something that does not require to alter too much in the CSS, as that would probably confuse me, as I am still learning in that field.

 

Any help will be gratefully accepted.

 

Thank you in advance.