Need help with sidebar CSS problem. Located at bottom of site?
-
Hey guys, hoping I’d be able to get some help here regarding my blog.
I noticed my right sidebar is showing up at the bottom of the website now instead of where it is supposed to be (right side of the posts towards the top of the page). I went into the CSS a few days ago to change the post width, but ended up not saving the changes because i didn’t like the way it looked.
I’m using the Neo-Sapien theme with slightly modified CSS that has been working correctly for the past year or so now.
Here is the CSS for the website, if anyone could help me out it would be greatly appreciated.
Thanks,
Anthony
CSS: ‘body,h1,h2,h3,h4,h5,h6,form,ol,p {
margin:0;
padding:0;
}h1,h2,h3,h4,h5,h6 {
font-size:12px;
}body {
font-family:Verdana, Arial;
font-size:12px;
text-align:left;
vertical-align:top;
color:#ccc;
background:#2b2b2b url(‘images/bg_body.gif’) repeat-x;
}table {
font-family:Arial, Verdana;
font-size:11px;
}form,input,textarea {
font-family:Arial, Verdana;
font-size:11px;
}input,textarea {
border:1px solid #262626;
color:#ccc;
background:#111;
margin:0 0 1px;
}a {
text-decoration:underline;
color:#fff;
}a:hover {
text-decoration:none;
}img {
border:0;
}#sidebar {
float:left;
width:140px;
font-family:Arial, Verdana;
font-size:11px;
line-height:18px;
text-align:left;
vertical-align:top;
color:#ccc;
background:#000;
margin:288px 0 0;
}#sidebar ul {
text-align:left;
vertical-align:top;
list-style:none;
margin-left:0;
padding:10px;
}#sidebar ul li {
font-family:”Trebuchet MS”, Arial, Verdana;
font-weight:bold;
color:#c30000;
margin:0 0 5px;
}#sidebar ul li a {
text-decoration:none;
color:#c30000;
}#sidebar ul li a:hover {
text-decoration:underline;
}#sidebar ul li h2 {
border-bottom:1px solid #262626;
font-family:”Trebuchet MS”, Arial, Verdana;
font-size:11px;
font-weight:bold;
color:#c30000;
margin:0 0 5px;
padding:0 0 5px;
}#sidebar ul ul {
padding:0;
}#sidebar ul ul li {
font-family:Arial, Verdana;
font-weight:normal;
color:#ccc;
margin:0;
padding:0;
}#sidebar ul ul li a {
text-decoration:underline;
color:#fff;
}#sidebar ul ul li a:hover {
text-decoration:none;
}.narrowcolumn {
float:left;
width:800px;
font-family:Verdana, Arial;
font-size:12px;
text-align:left;
vertical-align:top;
color:#ccc;
background:#000;
overflow:hidden;
margin:22px 0 0;
padding:0 0 70px;
}#menu {
text-align:left;
vertical-align:top;
color:#ccc;
background:#000;
padding:0 0 0 10px;
}#menu ul {
margin:0;
padding:0;
}#menu ul li {
float:left;
border-top:2px solid #c00;
font-family:Arial, “Trebuchet MS”;
font-size:11px;
font-weight:bold;
background:#444 url(‘images/bg_menu_item.gif’) repeat-x;
list-style:none;
margin:0 5px 0 0;
padding:6px 15px 7px;
}#menu ul li a {
text-decoration:none;
}#menu ul li a:hover {
text-decoration:underline;
}#header {
clear:both;
width:800px;
background:#000;
text-align:center;
vertical-align:middle;
color:#333;
padding:10px 0;
}.post h2 {
border-top:2px solid #c00;
font-family:”Times New Roman”, Arial;
font-size:18px;
font-weight:normal;
text-align:left;
vertical-align:top;
line-height:24px;
color:#fff;
background:#000 url(‘images/bg_post_title.gif’) repeat-x;
padding:18px 20px 17px;
}.post h2 a {
text-decoration:none;
}.post h2 a:hover {
text-decoration:underline;
}.entry {
border-top:1px solid #fff;
text-align:left;
vertical-align:top;
line-height:18px;
color:#000;
background:#eee;
padding:10px 20px 20px;
}.sticky h2 {
background:#D60000;
}.entry p {
padding:10px 0 0;
}.entry a {
color:#c00;
}p.postmetadata,post-date,cite {
font-family:Arial, “Trebuchet MS”;
font-size:11px;
font-style:normal;
}.postmetadata {
clear:both;
}.navigation {
text-align:left;
vertical-align:top;
line-height:18px;
color:#ccc;
background:#000;
padding:20px;
}.image-navigation {
margin-top:20px;
}.commentlist ol,.commentlist ol li {
list-style-type:none;
}.commentlist ol {
margin:0 0 10px;
}.commentlist ol li {
margin-bottom:5px;
border:1px solid #e6e6e6;
font-size:11px;
background:#fff;
color:#333;
padding:10px;
}blockquote {
border:1px solid #e6e6e6;
font-family:Arial;
font-size:11px;
line-height:18px;
text-align:left;
vertical-align:top;
background:#fff;
color:#333;
margin:5px 0 5px 5px;
padding:5px 10px;
}#obar {
float:left;
width:360px;
text-align:left;
vertical-align:top;
background:#000;
margin:288px 0 0;
}.sub-obar {
float:left;
width:170px;
font-family:Arial, Verdana;
font-size:11px;
line-height:18px;
text-align:left;
vertical-align:top;
color:#ccc;
background:#000;
margin:0;
}.sub-obar ul {
text-align:left;
vertical-align:top;
list-style:none;
margin-left:0;
padding:10px 0 10px 10px;
}.sub-obar ul li {
font-family:”Trebuchet MS”, Arial, Verdana;
font-weight:bold;
color:#c30000;
margin:0 0 5px;
}.sub-obar ul li a {
text-decoration:none;
color:#c30000;
}.sub-obar ul li a:hover {
text-decoration:underline;
}.sub-obar ul li h2 {
border-bottom:1px solid #262626;
font-family:”Trebuchet MS”, Arial, Verdana;
font-size:11px;
font-weight:bold;
color:#c30000;
margin:0 0 5px;
padding:0 0 5px;
}.sub-obar ul ul {
padding:0;
}.sub-obar ul ul li {
font-family:Arial, Verdana;
font-weight:normal;
color:#ccc;
margin:0;
padding:0;
}.sub-obar ul ul li a {
text-decoration:underline;
color:#fff;
}.sub-obar ul ul li a:hover {
text-decoration:none;
}#wp-calendar {
margin:5px 0 0;
}#wp-calendar caption {
font-size:10px;
font-weight:bold;
text-align:left;
color:#c00;
background:#000;
padding:0 0 0 10px;
}#wp-calendar th,#wp-calendar td {
color:#ccc;
background:#000;
padding:3px;
}#comment {
width:95%;
margin-bottom:.5em;
padding:.4em;
}.avatar {
float:right;
border:1px solid #E8E7D0;
padding:2px;
}img.centered,img.aligncenter {
display:block;
margin-left:auto;
margin-right:auto;
}img.alignright {
display:inline;
margin:0 0 2px 7px;
padding:4px;
}img.alignleft {
display:inline;
margin:0 7px 2px 0;
padding:4px;
}.alignright {
float:right;
}.alignleft {
float:left;
}.aligncenter,div.aligncenter {
display:block;
margin-left:auto;
margin-right:auto;
}.wp-caption {
border:1px solid #ddd;
text-align:center;
background-color:#f3f3f3;
padding-top:4px;
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
margin:10px;
}.wp-caption img {
border:0 none;
margin:0;
padding:0;
}.wp-caption p.wp-caption-text {
font-size:11px;
line-height:17px;
margin:0;
padding:0 4px 5px;
}’The blog I need help with is: (visible only to logged in users)
-
This is most often caused by an open HTML tag in one of your posts.
Go to settings > writing and select “WordPress should correct invalidly nested XHTML automatically” and then click “save changes.”
Now, starting with your latest post, open it in the editor, switch from the visual tab to the HTML tab (waiting for the page to refresh) and then switch back to the visual tag (again waiting for it to refresh), and then click “update post.” Check your blog and if it is back to normal, you are golden. If not, open the next post and do the same thing till it goes back to normal.
-
-
I hope this will help you. When you alter a theme’s stylesheet, you only need to put in the Editor the modification/additions to the CSS, not the entire thing. Read this for more info: http://csswiz.wordpress.com/2009/10/15/if-you-have-the-wp-com-css-upgrade/
-
You widened the content area, but you never widened the parent element, #wrapper. The sidebar didn’t have anyplace to “be” so it had to park itself down below the content.
#wrapper {width:1300px; }When widening any theme, you have to start with the outer most element and then work down from there.
-
-
- The topic ‘Need help with sidebar CSS problem. Located at bottom of site?’ is closed to new replies.
WordPress.com Forums 