• Dear wordpress users,

    First time using wordpress here. My page is still bare right now I’m just trying to get the background images showing before beginning on content.

    I don’t know how to make my background show up and repeat-x. I’ve tried inserting the code in just about every file except it just wont show.

    Here’s the website:
    http://www.serenaderevival.com

    Alternatively, here is my style.css

    /* basics */

    *{margin:0; padding:0;
    }

    body {
    background: url(‘images/bg.jpg’) top center repeat-x;
    font-family: arial, helvetica, sans-serif;
    font-size: 10pt;
    margin:20px;
    color:#222222;
    }

    h1 {font-size: 18pt;}
    h2 {font-size: 14pt;}
    h3 {font-size: 10pt;}
    h4 {font-size: 9pt;}

    img{
    border: none;
    padding:0;
    }
    img a{border:none;}

    img.left{ float: left; border: none; padding: 6px 0 0 0; }
    img.right{ float: right; border: none; padding: 0 0 0 6px; }

    blockquote{

    margin:15px;
    padding:0 12px 0 12px;
    }

    /* links */

    a{
    color:#1755C8;
    text-decoration:none;
    }

    a:hover{text-decoration: underline;
    color; #CC0000
    }

    /* container */

    #container {
    width:1000px;
    margin: 0 auto;
    padding:0;
    background:#fff;
    color:#333;
    overflow: hidden;
    }

    /* header */

    #header {
    width:1000px;
    height:201px;
    }

    #header h1{
    font:normal 20pt georgia, times;
    padding:20px 0 0 16px;
    margin:0;
    }

    #header h1 a{color: #404040; text-decoration: none;}
    #header h1 a:hover{color: #666; text-decoration: none;}

    #header h2{
    font:normal 10pt georgia, times;
    color:#333;
    padding: 0 0 0 18px;
    margin:0;
    }

    /* main menu */

    #menu {
    background:#000;
    font-family: verdana, arial, times, serif;
    font-size: 8pt;
    width:100%;
    overflow:hidden;
    }

    #menu ul {
    margin:0;
    padding:0;
    }

    #menu ul li {
    list-style-type: none;
    float:left;
    margin: 0;
    padding: 0;
    }

    #menu ul li a {
    padding:4px 10px;
    margin: 0;
    color: #fff;
    display:block;
    }

    #menu ul li a:hover {
    background: #fff;
    color:#000;
    }

    /* content */

    #content {
    float: left;
    width:550px;
    overflow: hidden;
    margin: 10px;
    }

    .post {
    margin:0;
    padding:0;
    line-height: 14pt;
    }

    .post h2{
    font:normal 15pt georgia, times;
    }

    .post h2 a{
    color: #000;
    text-decoration: none;
    }

    .post h2 a:hover{
    color: #777;
    text-decoration: none;
    }

    .post ul {}

    .post li {}

    .entry p{margin:12px 0;}

    .postmetadata{
    clear: both;
    background:#F7F7F7;
    padding:6px;
    margin: 20px 0;
    }

    .navigation {
    font-size:10pt;
    width:100%;
    float:left;
    margin:0;
    padding:0;
    overflow:hidden;
    }

    .alignleft a{float:left; margin:25px 0;}
    .alignright a{float:right; margin:25px 0;}

    /* left sidebar */

    #left {
    width:240px;
    float:left;
    margin:0;
    padding:0;
    height: 1000px;
    background-image: url(images/side_bar.jpg);
    }

    #left h2{
    font:normal 11pt arial, georgia, times;
    color: #000;
    margin: 0;
    padding: 0;
    }

    #left label{
    font:normal 11pt arial, helvetica, sans-serif;
    color: #000;
    margin: 0;
    padding: 0;
    }

    #left p {margin:0; padding: 0;}

    #left img {padding: 0; margin: 0;}

    #left ul {
    margin:12px;
    padding:0;
    }

    #left ul li {
    margin: 0;
    padding: 0;
    line-height: 14pt;
    list-style-type: none;
    }

    #left ul ul {
    margin:14px 0;
    padding: 0;
    }

    #left ul ul li {
    list-style-type: none;
    }

    #left ul ul ul{
    margin: 0;
    padding: 0;
    }

    #left ul ul ul li{
    padding: 0 0 0 15px;
    list-style-type: square;
    color: #898989;
    }

    /* right sidebar */

    #right{
    width:190px;
    float:right;
    margin:0;
    padding: 0;
    }

    #right h2{
    font:normal 11pt arial, helvetica, sans-serif;
    color: #000;
    margin: 0;
    padding: 0;
    }

    #right label{
    font:normal 11pt arial, helvetica, sans-serif;
    color: #000;
    margin: 0;
    padding: 0;
    }

    #right p {margin:0; padding:0;}

    #right img {padding: 0; margin: 0;}

    #right ul {
    margin:12px;
    padding:0;
    }

    #right ul li {
    margin: 0;
    padding: 0;
    line-height: 14pt;
    list-style-type: none;
    }

    #right ul ul {
    margin:14px 0;
    padding: 0;
    }

    #right ul ul li {
    list-style-type: none;
    }

    #right ul ul ul{
    margin: 0;
    padding: 0;
    }

    #right ul ul ul li{
    padding: 0 0 0 15px;
    list-style-type: square;
    color: #898989;
    }

    /* comments */

    #commentform{
    background:#fff;
    margin:0;
    padding:0;
    }

    #commentform p{
    color: #000;
    }

    #commentform a{color: #000; text-decoration: none; border-bottom: 1px dotted #465D71;line-height: 14pt;}

    #commentform h3{
    font-family: georgia, times, verdana;
    font-size: 10pt;
    font-weight: 300;
    color: #000;
    margin:0;
    padding:0;
    }

    #comment{
    width:80%;
    }

    #author, #email, #url, #comment, #submit{
    background: #fff;
    font-family: verdana, arial, times;
    font-size: 8pt;
    margin:5px 5px 0 0;
    padding:0;
    }

    #submit{margin:5px 5px 0 0;}

    #comments{margin:0; padding:0}

    ol.commentlist {list-style-type: none; margin:0; padding:0;}

    .avatar{float:left; margin:0 12px 0 0;}

    ol.commentlist li {
    background: #fff;
    margin:10px 0;
    padding:5px 0 5px 10px;
    list-style-type:none;
    }

    ol.commentlist li.alt {background: #eee;}
    ol.commentlist li p {margin: 6px 0 6px 0; padding: 0 12px 0 0; line-height: 14pt;}

    ol.commentlist a {color:#000;}

    cite {
    font-family: arial, verdana, tahoma;
    font-size: 9pt;
    font-weight: bold;
    font-style: normal;
    }

    cite a{color: #000; text-decoration: none; border-bottom: 1px dotted #465D71;}

    /* search */

    #searchform{
    padding:0;
    margin:14px 0;
    }

    #searchform input#s{
    margin:0;
    border:1px solid #000;
    padding:2px;
    }

    /* misc */

    img.centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }

    img.alignright {
    padding: 4px;
    margin: 0 0 2px 7px;
    display: inline;
    }

    img.alignleft {
    padding: 4px;
    margin: 0 7px 2px 0;
    display: inline;
    }

    .alignright {
    float: right;
    width: 750px;
    height: 120px;
    }

    .alignleft {
    float: left
    }

    .wp-caption {
    border: 1px solid #ddd;
    text-align: center;
    background-color: #f3f3f3;
    padding-top: 4px;
    margin: 10px;
    /* optional rounded corners for browsers that support it */
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    }

    .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;
    }

    /* footer */

    #footer {
    background:#ffffff;
    clear: both;
    width: 100%;
    background-image: url(images/footer.jpg);
    padding-top: 30px;
    height: 100px;
    }

    #footer p{padding:14px 0;margin: 0; color: #eee; text-align:center;}
    #footer a{color: #BCBCBC;text-decoration: none;}
    #footer a:hover{color: #5D5D5D;text-decoration: underline;}

    Please help,
    Thanks

Viewing 1 replies (of 1 total)
  • What do you mean by “Alternatively here’s my css”, where else were you placing the background code?

    When you create sytles or defintions in style.css for your theme..

    images/someimage.jpg

    is a relative path from where the current file (style.css) is…

    If you try to use that same path in another file then it won’t necessarily work unless that file resides in the same directory as the stylesheet (your theme folder)..

Viewing 1 replies (of 1 total)
  • The topic ‘Background image wont show’ is closed to new replies.