Ok, so I'm customizing a WordPress template for myself and a friend and I'm having an issue. He wanted the sidebars to be separate which I got. The thing is, the left sidebar is not formatted like the others now. Here is the CSS code for the left sidebar, the content, and the right sidebar (sorry about the scale of it):
The site is here: TPNDEMO to give you an idea of it.
Any advice would be much appreciated. Thanks everyone.
EDIT: Fixed it. Never mind.
Code:
/************************************************
* Left Sidebar *
************************************************/
#l_sidebar {
float: left;
width: 225px;
margin: 25px 0px 0px 20px;
padding: 0px 0px 20px 0px;
border-top: 2px solid #000000;
}
#l_sidebar ul {
list-style: none;
margin: 0px;
padding: 0px;
}
#l_sidebar ul li {
display: inline;
padding: 0px;
margin: 0px;
}
#l_sidebar ul li a {
display: block;
color: #000000;
text-decoration: none;
margin: 0px;
padding: 5px 0px 5px 0px;
border-bottom: 1px solid #C0C0C0;
}
#l_sidebar ul li a:hover {
background: #EFEFEF;
color: #800000;
}
#l_sidebar p{
padding: 3px 0px 0px 0px;
margin: 0px;
line-height: 20px;
}
/************************************************
* Content *
************************************************/
#content {
width: 960px;
margin: 0px auto 0px;
padding: 0px;
}
#content p{
padding: 0px 0px 15px 0px;
margin: 0px;
line-height: 20px;
}
#content h1 {
color: #000000;
font-size: 22px;
font-family: Century Gothic, Verdana, Arial, Sans-Serif;
font-weight: normal;
margin: 25px 0px 0px 0px;
padding: 20px 0px 10px 0px;
border-top: 2px solid #000000;
}
#content h1 a {
color: #000000;
text-decoration: none;
}
#content h1 a:hover {
color: #800000;
text-decoration: none;
}
#content p img{
float: left;
border: none;
margin-right: 15px;
margin-bottom: 10px;
}
#content h2 {
color: #000000;
font-size: 22px;
font-family: Century Gothic, Verdana, Arial, Sans-Serif;
font-weight: normal;
padding: 20px 0px 5px 0px;
margin: 0px;
border-bottom: 1px solid #C0C0C0;
}
#content h3 {
color: #000000;
font-size: 22px;
font-family: Century Gothic, Verdana, Arial, Sans-Serif;
font-weight: normal;
margin: 25px 0px 0px 0px;
padding: 20px 0px 10px 0px;
}
#content img.wp-smiley {
float: none;
border: none;
padding: 0px;
margin: 0px;
}
#content img.wp-wink {
float: none;
border: none;
padding: 0px;
margin: 0px;
}
#contentleft {
float: left;
width: 470px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 20px 0px;
}
#contentleft ol{
margin: 0px 0px 0px 20px;
padding: 0px 0px 10px 0px;
}
#contentleft ol li{
margin: 0px 0px 0px 20px;
padding: 0px 0px 5px 0px;
}
#contentleft ul{
list-style-type: square;
margin: 0px 0px 0px 20px;
padding: 0px 0px 10px 0px;
}
#contentleft ul li{
list-style-type: square;
margin: 0px 0px 0px 20px;
padding: 0px 0px 5px 0px;
}
blockquote{
margin: 0px 25px 15px 25px;
padding: 0px 25px 0px 10px;
background: #E8E8E8;
border-top: 2px solid #000000;
border-bottom: 1px solid #000000;
}
#content blockquote p{
margin: 0px 0px 10px 0px;
padding: 10px 0px 0px 0px;
}
/************************************************
* Right Sidebar *
************************************************/
#r_sidebar {
float: left;
width: 225px;
margin: 25px 0px 0px 0px;
padding: 0px 0px 20px 0px;
border-top: 2px solid #000000;
}
#r_sidebar ul {
list-style: none;
margin: 0px;
padding: 0px;
}
#r_sidebar ul li {
display: inline;
padding: 0px;
margin: 0px;
}
#r_sidebar ul li a {
display: block;
color: #000000;
text-decoration: none;
margin: 0px;
padding: 5px 0px 5px 0px;
border-bottom: 1px solid #C0C0C0;
}
#r_sidebar ul li a:hover {
background: #EFEFEF;
color: #800000;
}
#r_sidebar p{
padding: 3px 0px 0px 0px;
margin: 0px;
line-height: 20px;
}
Any advice would be much appreciated. Thanks everyone.
EDIT: Fixed it. Never mind.