WordPress.org

1. AEShain
   Member
   Posted 2 years ago #

   I've tried several CSS fixes to get the sidebars grey background to extend beyond the content to the bottom of the page, nothing is working.

   site: http://allieiswired.com

   Please help!
   Thanks,
   Allie

   #l_sidebar { color: #cccccc; background-color: #3a3a3a; width: 160px; float: left; float: left; margin-top: 0; margin-bottom: 20px; padding: 0 15px 15px 15px; }
   #l_sidebar p{
           margin: 0px;
   	line-height: 16px;
           padding: 0px 0px 5px 0px;
   	}
   #l_sidebar h2 {
   	color: #ffbfea;
   	font-size: 18px;
   	font-family: Verdana, Helvetica, Arial, Sans-Serif;
   	font-weight: bold;
   	list-style: none;
   	padding: 10px 0px 10px 0px;
           margin: 0px;
   	}
   
   #l_sidebar ul {
   	list-style: none;
   	margin: 0px;
   	padding: 0px 0px 20px 0px;
   	}
   
   #l_sidebar li {
   	list-style: none;
   	margin: 0px;
   	padding: 0px;
   	}
   
   #l_sidebar ul li {
   	list-style: none;
   	margin: 0px;
   	padding: 6px 0px 5px 0px;
   	}
   
   #l_sidebar ul li a {
   	color: #c04080;
   	text-decoration: none;
   	}
   
   #l_sidebar ul li a:hover {
   	color: #c04080;
   	text-decoration: underline;
   	}
   
   #r_sidebar { color: #c04080; background-color: #3a3a3a; width: 160px; float: right; position:relative; margin-top: 0; margin-bottom: 20px; padding: 0 15px 15px 15px; }
   #r_sidebar p{
           margin: 0px;
   	line-height: 16px;
           padding: 5px 0px 10px 0px;
   	}
   #r_sidebar h2 {
   	color: #ffbfea;
   	font-size: 18px;
   	font-family: Verdana, Helvetica, Arial, Sans-Serif;
   	font-weight: bold;
   	list-style: none;
   	padding: 10px 0px 10px 0px;
           margin: 0px;
   	}
   
   #r_sidebar ul {
   	list-style: none;
   	margin: 0px;
   	padding: 0px 0px 20px 0px;
   	}
   
   #r_sidebar li {
   	list-style: none;
   	margin: 0px;
   	padding: 0px;
   	}
   
   #r_sidebar ul li {
   	list-style: none;
   	margin: 0px;
   	padding: 6px 0px 5px 0px;
   	}
   #r_sidebar ul li a {
   	color: #c04080;
   	text-decoration: none;
   	}
   
   #r_sidebar ul li a:hover {
   	color: #c04080;
   	text-decoration: underline;
   	}

2. Sivar
   Member
   Posted 2 years ago #

   You have indeed a problem. As far as I know, there is no simple way in css to force one div's height to another indepentent div's (flexible) height.

   But there are tricks (very complicated ones, I admit): This deals with your problem, but although it says "easy clearing", it is everything but easy. Sorry ;)...

Topic Closed

This topic has been closed to new replies.