Support » Fixing WordPress » How to add or change a wrapper

  • hey folks.

    not only can i not change the “wrapper” (which i believe is what to call the area outside of my sidebars), but i cannot even find any mention of it in my stylesheet. if anyone knows how to add/change the color, i would appreciate it. here is my CSS:

    * Theme Name: Lemming
    * Theme URI:
    * Description: Simple and easy to use theme, in two colors: blue and white. It has 3 columns, supports widgets and gravatars and is SEO friendly. Created by TechLemming.
    * Author: TechLemming
    * Author URI:
    * Tags: three-columns, blue, white, fixed-width, threaded-comments
    * Version: 1.01
    The CSS, XHTML and design is released under GPL.
    img.alignright { float:right; margin:0 0 1em 1em;}
    img.alignleft { float:left; margin:0 1em 1em 0;}
    img.aligncenter { display: block; margin-left: auto; margin-right: auto;}
    a img.alignright { float:right; margin:0 0 1em 1em;}
    a img.alignleft { float:left; margin:0 1em 1em 0;}
    a img.aligncenter { display: block; margin-left: auto; margin-right: auto;}
    img.wp-smiley { padding:0px; margin:0px; border:none;}
    a img.wp-smiley { padding:0px; margin:0px; border:none;}
    /* BODY */
    div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td {margin:0; padding:0;}
    body{font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; padding:0; margin:0; color:#B2B2B2;}

    /* BEGIN TOP Header – ETC /
    #box{width:960px;margin:0px auto; margin-top:-10px; padding:0; background:#000;}
    #header {width:960px; height:180px; margin:0; padding:0; background:#000; position:relative;}
    #header a:link,#header a:active,#header a:visited,#header a:hover { text-decoration:none; margin:0; padding:0; border:0;}

    #header h1 a,#header h1 a:active,#header h1 a:link,#header h1 avisited{ height:90px; overflow:hidden; position:absolute; top:25px; left:60px; z-index:0; margin:0; padding:0 0 0 9px; color:#00cc00; border:0; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; font-size:70px; text-decoration:none; font-weight:normal;}
    #header h1 a:hover{ text-decoration:underline;}
    #description{ position:absolute; top:110px; left:85px;margin:0; font-size:24px; text-decoration:none;padding:0; color:#00cc00;}
    /* NAVIGATION Menu * /

    #nav{width:960px; position:absolute; top:160px; left:0px; height:24px; background:#238E23 repeat-x top; float:left; margin:0; padding:0; clear:both; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif;}

    font: 67.5% “Lucida Sans Unicode”, “Bitstream Vera Sans”, “Trebuchet Unicode MS”, “Lucida Grande”, Verdana, Helvetica, sans-serif;
    .menu ul{
    .menu li{
    .menu li a{
    background:#238E23 url(“images/seperator.gif”) bottom right no-repeat;
    padding:0px 25px;
    .menu li a:hover, .menu ul li:hover a{
    background: #E9FB25 url(“images/hover.gif”) bottom center no-repeat;
    .menu li ul{
    .menu li:hover ul{

    .menu li li {
    background:url(‘images/sub_sep.gif’) bottom left no-repeat;
    .menu li:hover li a{

    .menu li ul a{
    font-style:normal;border-bottom: 1px solid #000;
    padding:0px 10px 0px 15px;
    .menu li ul a:hover, .menu li ul li:hover a{
    background:#E9FB25 url(‘images/hover_sub.gif’) center left no-repeat;
    .menu p{

    /* MAIN ENTRY * /

    #bgbox{width:960px; float:left; margin:-10px 0 0 0px; padding:0;}
    #content{width:570px;float:left;line-height:140%;padding:0; margin:10px 0 3px 0px;}
    #bgbox_bottom{width:960px; height:6px;float:left; background:url(i/m_bottom.gif) no-repeat left bottom; margin:0; padding:0;}
    .post{ font-size:12px; font-family:Verdana, Geneva, sans-serif; line-height:16px; word-spacing:1px; margin:5px 0px 1px 0px; padding:0px 5px 0px 0px; width:560px; float:left; color:#B2B2B2; }

    #content .post h1{width:560px; margin:10px 0 3px 0; padding:1px 0 0 0; font-size:18px; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif;text-align:center; color:#B2B2B2; background:#000; }
    #content .post h1 a,#content .post h1 a:active,#content .post h1 a:visited,#content .post h1 a:link{ margin:10px 0 2px 0px; padding:1px 0 3px 0; font-size:30px; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; color:#FF000D;text-decoration:none; font-weight:normal; line-height:1.2; }
    #content .post h1 a:hover{ font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; color:#E9FB25; text-decoration:underline; }

    .post p {margin:4px 0px 8px 0px;color:#B2B2B2;}
    .post p strong {font-weight:bold; }
    .post p em {font-style:italic;}
    .post img {border:1px solid #666666; background-color:#000;padding:2px;margin:10px;}
    .post blockquote {padding:10px;font-style:italic;font-size:11px;}
    .post img.wp-smiley {border:none;padding:0px;margin:0px;background:none;}
    #content .post ul, .post ol { margin:0px 0px 10px 16px;}
    #content .post ul li,#content .post ol li {margin:2px 0px 2px 16px;}

    #content .post p ul, .post p ol { margin:0px 0px 10px 16px;}
    #content .post p ul li,#content .post p ol li { margin:2px 0px 2px 16px;}
    #content .post li { margin:0px 0px 0px 10px;}

    .small{ width:560px; font-size:10px; color:#C6C6C6; text-transform:uppercase;border-top:1px solid #00CC00;margin:0px 0px 8px 0px; padding:0; float:left;}
    .postinfo{font-size:11px;border-top:1px dotted #00CC00;border-bottom:1px dotted #00CC00 ;padding:6px;margin:5px 0px 10px 0px;background-color:#000;}
    .postinfo p { margin:0px 0px 5px 0px;}
    .postinfo p.cent {margin:0px;text-align:center;font-weight:bold;}

    .postinfo a{font-weight:bold; color:#00CC00; text-decoration:none;}
    .entry{width:520px;float:left;color:#00CC00;margin:0 0 10px 2px;padding:0;}
    .entry p{text-align:justify;}

    .entry2{width:520px;float:left;color:#8E2424;text-align:justify;margin:1px 0 0 3px;padding:1px 6px 10px 3px;}

    .left {float:left; width:200px; padding-right:10px; border-right:1px dashed #00CC00; color:#00CC00;}
    .right {float:right;padding-right:20px;width:240px; color:#00CC00;}
    .clear {clear:both}

    /* Something * /
    .navigation{width:560px; height:16px;float:left;border-bottom:1px solid #00CC00;border-top:1px solid #00CC00;text-transform:uppercase; font-weight:bold; font-size:12px;padding:0 0 10px;}

    .snavigation{width:560px; height:16px;float:left;border-bottom:1px solid #00CC00;border-top:1px solid #00CC00;text-transform:uppercase; font-weight:bold; font-size:12px; margin:10px 0 10px 0;padding:0 0 10px;}

    .sIFR-flash {visibility: visible !important;margin: 0;}
    .sIFR-replaced {visibility: visible !important;}
    span.sIFR-alternate {position: absolute;left: 0;top: 0;width: 0;height: 0;display: block;overflow: hidden;}
    .postmetadata{ font-size:11px; border-top:1px dotted #00CC00 ; border-bottom:1px dotted #00CC00 ; padding:6px;margin:5px 0px 20px 0px;background:#000; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif;}
    .postmetadata p {margin:0px 0px 10px 0px;}
    .postmetadata p.cent {margin:0px;text-align:center;font-weight:bold;}
    .postinfo2{font-size:11px;border-top:1px dotted #00CC00 ;padding:6px;margin:5px 0px 20px 0px;background-color:#000; }

    acronym,abbr{border-bottom:1px dashed #00CC00;}

    blockquote{padding-left:20px;border-left:5px solid #00CC00;margin:15px 30px 0 10px;}
    blockquote cite{display:block;margin:5px 0 0;}
    * html .clearfix{height:1%;}
    #past { padding:0; margin:0;}
    #tags a{text-decoration:none;font-weight:bold;}

    /* RSS * /

    .rss-field{width:150px; margin-left:10px; padding:0; }
    /* SIDEBAR * /
    #searchform {margin: 10px 0 10px 20px; padding:0; font-size:14px; color:#E9FB25;}
    .search_body{margin:4px 0 0 0; padding:0;}

    #sidebar{width:465px; height:100%;float:left;font-size:11px;padding:0; margin:10px 0 0 12px; }

    .rsidebar {width:200px;float:right;padding:0;margin:10px 0px 0px 3px;}
    .rsidebar a, .rsidebar a:visited {text-decoration:none;color:#B2B2B2; line-height:1.1;}
    .rsidebar a:hover {text-decoration:underline;}

    .rsidebar ul {list-style:none; list-style-type:none; padding:0;width:200px;margin:5px 0px 5px 0px;font-size:12px;line-height:14px;font-family:Verdana, Geneva, sans-serif;}
    .rsidebar ul li{ list-style:none; list-style-type:none; margin:3px 0 3px 0; padding:0;}
    .rsidebar ul li h2 {font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif;font-size:16px;line-height:18px;padding:1px 6px 1px 2px;background:#238E23 ;color:#000; margin:0;}

    .rsidebar ul li ul li{padding:2px 0px 2px 5px;}
    .rsidebar ul li ul li:hover {background-color:#000;color:#E9FB25;}
    .rsidebar ul li a, .rsidebar ul li a:visited {text-decoration:none;color:#B2B2B2;}
    .rsidebar ul li a:hover {text-decoration:underline;color:#E9FB25;}
    #sidebar img,.lsidebar img{border:0;}
    .rsidebar p,.lsidebar p{padding:0 5px;}
    #info a img {border:none;}

    .lsidebar { width:170px;float:left;overflow:hidden; padding:0; margin:0px 0 0 0;}
    .lsidebar a, .lsidebar a:visited {text-decoration:none;color:#B2B2B2;}
    .lsidebar a:hover {text-decoration:underline;color:#E9FB25;}
    .lsidebar ul li h2 {font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif;font-size:16px;line-height:18px; padding:0; margin:0;padding:1px 6px 1px 2px;background:#238E23 ;color:#000; margin:0}
    .lsidebar ul {list-style:none;width:160px; margin:30px 0 5px 0;}
    .lsidebar ul li {padding:3px 0px 3px 1px; margin:0; list-style:none; list-style-type:none;}

    .lsidebar ul li ul{list-style:none;width:150px;margin:0;font-size:12px;line-height:14px;font-family:Verdana, Geneva, sans-serif;}
    .lsidebar ul li ul li{padding:2px 5px 2px 4px;}
    .lsidebar ul li ul li:hover { background-color:#000;color:#E9FB25;}
    .lsidebar ul li ul li a, .lsidebar ul li ul li a:visited {text-decoration:none; color:#B2B2B2;}
    .lsidebar ul li ul li a:hover {text-decoration:underline;color:#E9FB25;}

    /* FOOTER * /
    #footer{width:942px;height:45px;clear:both;font-size:11px;margin-top:10px; padding:10px 0 0 0; text-align:center; color:#999999; border-top:4px #111 solid;}
    #footer a,#footer a:active,#footer a:link,#footer a:visited{text-decoration:none;color:#FF000D ;border:none;}
    #footer a:hover{color:#00CC00 ; text-decoration:underline;}
    /* COMMENTS* /

    .boxcomments{width:560px; padding:0; margin-left:0; margin-right:0; margin-top:0; float:left;}
    #commentform{margin:0;padding:15px 15px 1px 0; border:0;}
    #commentform label{ width:140px; font-size:14px;color:#FF000D;display:block;margin:0; padding:0;}
    .label{float:left; width:140px; font-size:14px;display:block;margin:0; padding:0;}
    #commentform input{width:150px;margin:0 5px 10px 0;padding:1px;}
    #commentform textarea{width:420px;margin:0 0 10px;padding:0;}
    #commentform #submit{margin:0 0 20px;}
    #commentform p{margin:5px 0;}
    ol.commentlist{margin:0 0 1px;padding:0;}
    .alt{ margin:0; padding:0;}
    ol.commentlist li{ border:2px solid #BB2626; color:#B2B2B2; font-size:12px;padding:10px; font-size:12px; margin:0px 0px 10px 0px;overflow:hidden;}
    /* assss */
    ol.commentlist li ul{width:540px; margin:0; padding:0;}
    ol.commentlist li ul li { margin: 5px -5px 0 10px; padding:0; list-style-type:none;list-style: none; }
    ol.commentlist li ul li ul {width:380px; margin:0; padding:0;}
    ol.commentlist li li { border:none; width:330px;background:none;list-style:none;margin:3px 0 3px 20px;padding:3px 0 0 0; list-style-type:none;}
    .children { padding: 0; }
    ol.commentlist li a,ol.commentlist li a:active,ol.commentlist li a:visited,ol.commentlist li a:link{ text-decoration:none; color:#FF000D ;}
    ol.commentlist li a:hover{ text-decoration:underline;}
    ol.commentlist li :hover{background:none;}
    ol.commentlist li img{float:right; width:32px; height:32px; padding:0; }
    ol.commentlist li.commenthead{display:block;list-style:none;margin:0;padding:5px 0 15px 0; border:0; color:#FF000D;}
    ol.commentlist li.commenthead h2{margin:0; font-size:16px; font-weight:bold; margin:10px 0 0 0;}
    ol.tblist{list-style:none;margin:0 0 1px;padding:0;}
    ol.tblist li{display:block;list-style:none;padding:10px 5px 10px 5px;margin:0 0 5px; border:1px dashed #FF000D;}
    input#url,input#author,input#email,textarea{border:2px solid #999999;
    font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; font-size:14px; color:#000;}
    #respond{ background-color:#999999; padding:10px; }

    .Cbutton {width: 171px; height: 30px;margin:0px 0px 0px 0px;border:1px #CCC solid; color:#238E23 ; font-weight:bold; font-size:14px;}
    .Cbutton:hover {margin:0px 0px 0px 0px; color:#00803a}

    /* LINKS H1 H2 H3 H4 H5* /
    #info h1 { margin:0 0 10px 0; padding:0; font-size:15px; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; color:#00CC00 ; }
    .rsidebar h2 { margin:0 0 10px 0; padding:0; font-size:15px; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; color:#00CC00 ; }
    .lsidebar h2 { margin:0px 0 10px 13px; padding:4px 0 0 0; font-size:15px; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; color:#00CC00 ; }

    #content .entry h1 { margin:10px 0 2px 0px; padding:1px 0 5px 10px; font-size:30px; font-family:”Trebuchet MS”, Arial, Helvetica, sans-serif; color:#FF000D; text-decoration:none; font-weight:normal; line-height:1.2; }

    .entry a:link,.entry a:visited { color:#B2B2B2 ; font-weight:normal; text-decoration:none; }

    .entry a:hover,.entry a:active { text-decoration:underline;}
    .rsidebar a, .rsidebar a:link, .rsidebar a:active,.rsidebar a:visited{ color:#B2B2B2 ; font-weight:normal; text-decoration:none; }
    .rsidebar a:hover{font-weight:normal; text-decoration:underline; color:#E9FB25;}
    #content a,#content a:active, #content a:visited, #content a:link{ color:#FF000D ; text-decoration:none;}
    #content a:hover{text-decoration:underline;color:#E9FB25;}

    a, a:visited { text-decoration:none; color:#00CC00 ;}
    a:hover {text-decoration:underline;}

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

    .alignleft {
    float: left;

    .alignright {
    float: right;
    .wp-caption {
    border: 1px solid #00CC00;
    text-align: center;
    background-color: #000;
    padding: 3px 3px 3px 3px;
    margin: 10px;


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

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Michael


    Forum Moderator

    no need to post huge amounts of code here (and if you have to, please use a pastebin), a link to your site would be more effective.

    #wrapper is only a common name for the outermost div of a html page – in your case it is called #box.

    thanks for your help, and sorry about all the code. i tried to change the code for #box, and all that happened was that the poll in my sidebar disappeared. do you have a specific suggestion about where to input what code to make my wrapper black? here is my site:



    Forum Moderator

    your #box (wrapper) background is already black.

    the area outside the #box is referenced as ‘body’ in the style.css.

    add ‘background-color:#000;’to the body style:

    body{font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;	padding:0;	margin:0;	color:#B2B2B2;background-color:#000;}

    and all shall be black 😉

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to add or change a wrapper’ is closed to new replies.