• Hi all. I’m Dave, and relatively new to using WordPress. Would someone please help me with a problem with a style sheet? My blog is at http://bezaires.com. Notice that the background of the sidebar is red at the top (as i specified in the CSS file), but the unused bottom portion of the sidebar area is color #eeeeee. Can you please tell me how to get the entire sidebar column to be the red color? (I’ve included a copy of the CSS file below).

    Also, I am not seeing any spacing between paragraphs in the posts. Can you please tell me how to add some?

    Thanks,

    Dave

    /*
    Theme Name: Ramblings
    Theme URI:
    Description: A simple two column fluid width theme. Right sidebar supports widgets. Tags and gravatars supported. Valid XHTML and CSS.
    Version: 0.5
    Author: Dave Bezaire
    Author URI: http://bezaires.com
    Tags: blue, light, two-columns, flexible-width, right-sidebar, threaded-comments
    Derived from: Fluid-Blue located at http://srinig.com/wordpress/themes/fluid-blue/
    The CSS, XHTML and design is released under GPL:
    http://www.opensource.org/licenses/gpl-license.php
    */

    body {
    margin:0;
    color:#333333;
    font-size: 62.5%; /* Resets 1em to 10px */
    font-family: Verdana, Arial, Sans-Serif;
    text-align:center;
    }

    a {
    color:#928844;
    text-decoration:none;
    }

    a:hover {
    text-decoration:underline;
    }

    h1, h1 a, h2, h2 a, h3, h4, h5, h6 {
    margin-bottom:0;
    color:#A0590A;
    text-align:left;
    }

    h1 {font-size:2.6em;}
    h2 {font-size:2em;}
    h3 {font-size:1.6em;}
    h4 {font-size:1.2em;}
    h5 {font-size:1em;}
    h6 {font-size:0.8em;}

    img {
    border:0;
    }

    input {
    font-size:1.2em;
    }

    input[type=text], textarea{
    border:1px inset #aaa;
    }

    input[type=submit] {
    border:1px outset #aaa;
    }

    textarea {
    font-size:12px;
    }

    pre {
    font-size:12px;
    overflow:auto;
    }

    code {
    font-size:12px;
    color:#111;
    }

    /* Layout */
    #page {
    min-width:760px;
    margin:0 auto;
    text-align:left;
    }

    #wrapper {
    margin:0 5%;
    padding-right:230px;
    }

    #content{
    float:left;
    width:96%;
    border-right:230px solid #eee;
    margin-right:-230px;
    padding:20px 4% 20px 0;
    }

    #sidebar{
    float:left;
    width:190px;
    margin:0 -230px 0 0;
    padding:20px;
    }

    #footer {
    clear:both;
    padding:10px;
    border-top:0.2em solid #555;
    }

    /* Header */

    #header {
    margin:0;
    padding:2em 0;
    height:4.8em;
    border-top:0.2em solid #555;
    }

    #headertitle {
    float:left;
    position:absolute;
    top:2.4em;
    left:5%;
    }
    #headertitle h1 {
    margin:0;
    }
    #headertitle h1 a {
    color:9D5609;
    }
    #headertitle h1 a:hover {
    text-decoration:none;
    }

    #headertitle p {
    margin:0;
    color:9D5609;
    font-size:1.1em;
    }

    .search {
    float:right;
    padding:1.5em 5% 0 0;
    }
    .search form {
    margin:0;
    padding:0;
    }
    .search input {
    display:inline;
    width:218px;
    border:1px solid #555;
    margin:0;
    padding:0.2em 5px;
    color:#333333;
    font-size:1.1em;
    }

    /* Top navigation */
    #navbar {
    border-top:0.1em solid #555;
    border-bottom:0.1em solid #555;
    height: 2.3em;
    margin: 0px;
    padding: 0px ;
    }

    #nav {
    margin:0 5%;
    padding: 0;
    list-style: none;
    }

    #nav ul {
    padding:0.1em 0 0 0;
    margin:0;
    list-style: none;
    }

    #nav a {
    color:#EEEFBA;
    display: block;
    font-weight: bold;
    padding: 0.5em;
    }

    #nav a:hover {
    color: #fff;
    display: block;
    text-decoration: none;
    padding: 0.5em;
    }

    #nav li {
    float: left;
    margin: 0;
    text-transform:uppercase;
    padding: 0 2em 0 0;
    }

    #nav li li {
    float: left;
    margin: 0;
    padding: 0;
    width: 14em;
    }

    #nav li li a, #nav li li a:link, #nav li li a:visited {
    color: #c6c8c9;;
    width: 14em;
    float: none;
    margin: 0;
    padding: 0.5em ;
    border-bottom: 1px solid #aaa;
    }

    #nav li li a:hover, #nav li li a:active {
    color: #fff;
    }

    #nav li ul {
    position: absolute;
    width: 10em;
    left: -999em;
    }

    #nav li:hover ul {
    left: auto;
    display: block;
    }

    #nav li:hover ul, #nav li.sfhover ul {
    left: auto;
    }

    /* Sidebar */

    #sidebar ul {
    padding:0;
    margin:0;
    list-style: none;
    font-size:1.1em;
    }
    #sidebar ul ul {
    font-size:1em;
    }
    #sidebar ul li {
    margin:0 0 2em 0;
    }
    #sidebar ul ul {
    margin:0;
    padding:0;
    }
    #sidebar li li {
    margin:0.1em 0;
    }
    #sidebar li li li {
    padding-left:10px;
    }
    #sidebar ul h2 {
    margin:0;
    padding:0;
    color:#9D5609;
    font-size:1.2em;
    text-transform:uppercase;
    }

    /* Footer */
    #footer {
    text-align:center;
    font-size:1em;
    color:#333333;
    }

    #footer a {
    /* color:#A0590A; */
    color:#EEEFBA;
    font-weight: bold;
    }

    /* Post */
    .post {
    margin:0 0 4em 0;
    clear:both;
    }

    .post p, .post ol li, .post ul li{
    margin-top:0;
    font-size:1.2em;
    line-height:1.5em;
    text-align:justify;
    }
    .post li li {
    font-size:1em;
    }
    .post blockquote {
    padding:0 0 0 2em;
    border-left:0.4em solid #ccc;
    font-size:0.9em;
    }
    .post blockquote blockquote {
    margin-left:0;
    font-size:1em;
    }

    .postentry a {
    border-bottom:1px solid #ddd;
    }
    .postentry a:hover {
    border-bottom:1px solid #258;
    text-decoration:none;
    }

    .postmetadata {
    clear:both;
    margin:1em 0;
    font-size:1.1em;
    color:#727272;
    text-align:justify;
    }

    div.navigation {
    font-size:1.1em;
    }

    .postentry table {
    border-width:0 1px 1px 0;
    border-style:solid;
    border-color:#ccc;
    font-size:0.9em;
    }

    .postentry table tr td {
    padding:5px 10px;
    border-width:1px 0 0 1px;
    border-style:solid;
    border-color:#ccc;
    }

    .postentry table tr th {
    border-width:1px 0 0 1px;
    border-style:solid;
    border-color:#ccc;
    padding:5px 10px;
    color:#666;
    font-weight:bold;
    text-transform:uppercase;
    text-align:center;
    }

    /* Comments */

    #comments {
    font-size:1.4em;
    }

    .commentlist {
    margin:20px 0;
    padding:0;
    border-width:0 0.1em 0.1em 0;
    border-color:#eee;
    border-style:solid;
    }

    .commentlist li {
    list-style:none;
    margin:0;
    padding:0;
    border-width:0.1em 0 0 0.1em;
    border-color:#eee;
    border-style:solid;
    }

    li.comment div, li.pingback div {
    padding:20px;
    overflow:auto;
    }

    li.comment div div, li.pingback div div {
    padding:0;
    overflow:visible;
    }

    ul.children li {
    list-style:none;
    }

    img.avatar {
    float:right;
    border:1px solid #eee;
    padding:2px;
    margin:0;
    }

    .comment-meta, .reply {
    margin:0;
    padding:0;
    font-size:0.8em;
    }

    .comment-author cite {
    font-style:normal;
    font-weight:bold;
    font-size:1.2em;
    }

    textarea#comment {
    width:100%;
    }

    #comments div.navigation {
    font-size:0.9em;
    }

    /* Comment ends */

    /* Calendar */
    #wp-calendar caption {
    text-transform:uppercase;
    font-weight:bold;
    color:#aaa;
    text-align:left;
    }
    #wp-calendar thead th {
    font-weight:normal;
    color:#27a;
    text-align:center;
    }
    #wp-calendar tbody td {
    text-align:center;
    }
    #wp-calendar tbody td a {
    font-weight:bold;
    }
    #wp-calendar tbody td.pad {
    border:none;
    }
    /* Calendar ends */

    abbr {
    cursor:help;
    border-bottom: 0.1em dotted;
    }

    .aligncenter, div.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }

    .alignleft {
    float: left;
    margin: 5px 5px 5px 0;
    }

    .alignright {
    float: right;
    margin: 5px 0 5px 5px;
    }

    .wp-caption {
    border: 1px solid #ddd;
    text-align: center;
    padding-top: 4px;
    margin: 10px;
    }

    .wp-caption img {
    margin: 0;
    padding: 0;
    border: 0 none;
    }

    .wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    padding: 0 4px 5px;
    margin: 0;
    }

    .moretext {
    font-size: .76em;
    font-style: italic;
    font-variant: small-caps;
    }

    /* Background Colors */
    /* body { background:magenta; } */ /* #dddd99 */
    /* #content { background:red; } */ /* #dddd99 */
    /* #page { background:blue; } */ /* #e9ebaa */
    /* #wrapper { background:yellow; } */ /* #e9ebaa Don’t use */
    /* #navbar { background:green; } */ /* #D9CB80 */
    /* #footer { background:teal; } */ /* #D9CB80 */
    #sidebar { background:darkred; } /* #e9ebaa */
    /* #header { background:springgreen; } */ /* #e9ebaa */
    .wp-caption { background:#e9ebaa; }
    .postentry table tr th { background:#f4f4f4; }
    code { background:#f8f8f8; }
    .commentlist li.even { background:#fafafa; }
    .commentlist li.odd { background:#f6f6f6; }
    img.avatar { background:#fff; }
    input[type=text], textarea { background:#D9CB80; }
    input[type=submit] { background:#D9CB80; }
    .search input { background:#D9CB80; }
    #nav a:hover { background:#D9B568; }
    #nav li li a, #nav li li a:link, #nav li li a:visited { background:#165279; }
    #nav li li a:hover, #nav li li a:active { background:#237ab2; }
    /* #nav ul { background:transparent; } */

Viewing 2 replies - 1 through 2 (of 2 total)
  • intresting way to do it but change in your css:

    this:

    #content{
    float:left;
    width:96%;
    border-right:230px solid #eee;
    margin-right:-230px;
    padding:20px 4% 20px 0;
    }

    to this:

    #content {
    border-right:230px solid #E9EBAA;
    float:left;
    margin-right:-230px;
    padding:20px 4% 20px 0;
    width:96%;
    }
    Thread Starter Dave

    (@drandlomb)

    Thanks much, Tugbucket. That did the trick!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘CSS help’ is closed to new replies.