• I would like to make the white background behind my post transparent, just enough so that you can see the wallpaper on my site through it.

    My blog is at chrisfawkes.net

    The following is my style css if that helps at all.

    Thanks in advance.

    /*
    Theme Name: PhotoLounge
    Theme URI: http://wordpress.org/
    Description: A sleek, practical, and user-friendly Photography Blog Theme by SLR Lounge.
    Version: 1.0
    Author: SLR Lounge
    Author URI: http://slrlounge.com/
    Tags: photography, custom header, fixed width, one columns, widgets
    */

    /*Begin Commonly Edited Attributes */

    a {
    text-decoration: none;
    }

    a:hover, h2 a:hover, h3 a:hover {
    color:#000000;
    }

    h1, h2, h3 {clear:both;}

    body {
    font-size: 13px;
    font-family:Century Gothic, Helvetica, sans-serif;
    color: #666;
    text-align: center;
    margin:0;
    padding: 0;

    }

    .postmetadata{clear:both;}

    #pageborders {
    width:1030px;
    min-height:100%;
    background-image:url(images/border-sides.png);
    background-repeat:repeat-y;
    margin:auto;
    }

    #border-bottom {
    height:15px;
    width:1000px;
    background:url(images/border-bottom.png);
    }

    #page {
    text-align: left;
    margin:0 auto;
    background-color: ;
    margin:auto;
    padding:0;
    width:1000px;

    }

    .column {
    padding:20px 40px;
    margin:auto;
    width: 850px; /*this controls the width of the content */
    clear:both;
    }

    .post {
    margin: 0 0 100px;
    text-align: justify;
    }
    .clear {
    clear: both;
    }

    /* General Attributes */

    h1, h2, h3 {
    text-transform:uppercase;
    font-weight:normal; /*This used to make the titles of each post not bold */
    }

    h2 {
    font-size: 20px;
    }

    h2.pagetitle { /* These are the attributes for the Title of Archives, Categories, etc*/
    font-size:13px;
    text-align:left;
    float:left;
    margin:0;
    display:block;
    color:#999;
    }

    h1, h1 a, h1 a:hover, h1 a:visited {
    text-decoration: none;
    color: white;
    }

    h2, h2 a, h2 a:visited, h3 {
    color:#666;
    }

    h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
    text-decoration: none;
    }

    h1 {
    padding-top: 70px;
    margin: 0;
    }

    h2 {
    margin: 20px 0 0 0;
    }

    h2.pagetitle {
    margin-top:20px;
    text-align: center;
    }

    h3 {
    padding: 0;
    margin:10px 0 0;
    }

    h3.comments {
    padding: 0;
    margin: 40px auto 20px ;
    }
    /* End Headers */

    /* Begin Images */
    p img {
    padding: 0;
    max-width: 100%;
    }

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

    .alignleft {
    float: left;
    }

    /* End Images */

    /*start comments */
    .commentlist li, #commentform input, #commentform textarea {
    font: 0.9em Century Gothic, Helvetica, sans-serif;
    }
    .commentlist li ul li {
    font-size: 1em;
    }
    .commentlist li {
    font-weight: bold;
    }

    .commentlist li .avatar {
    float: right;
    padding: 2px;
    background: #fff;
    }

    .commentlist cite, .commentlist cite a {
    font-style: normal;
    font-size: 14px;
    }

    .commentlist p {
    font-weight: normal;
    line-height: 1.5em;
    text-transform: none;
    }

    #commentform p {
    font-family: Century Gothic, Helvetica, sans-serif;
    }

    .commentmetadata {
    font-weight: normal;
    }

    /*end comments*/

    /*Start Header */

    #header {
    background-color:#000;
    margin:0;
    padding:0;
    width: 1000px;
    }

    #logoimg {
    text-align:center;

    }

    #headerimg {
    margin:0;
    width: 1000px;
    }

    /**** End Header ***/

    /* Start Menu Items */

    #menu {
    list-style:none;
    margin:0;
    padding:0;
    background:#CCC;
    width:1000px;
    height:100%;
    border:none;
    }

    #menu:after {
    content:”;
    display:block;
    clear:both;
    }

    #menu li {
    padding:0 20px 0 20px;
    float:left;
    margin:13px 0;
    color:#666;
    text-transform:uppercase;
    z-index:99;

    }

    #menu li a {
    color:#666;
    vertical-align:bottom;
    font-size:12px;
    }

    #menu li.hover a,#menu li:hover a,#menu li.hover,#menu li:hover {
    position: relative;

    }

    #menu li.hover ul, #menu li:hover ul {
    display: block;
    }

    /*start drop-down menus on the top menu*/

    #menu ul {
    padding:0;
    margin:0 0 0 -10px;
    list-style:none;
    width:108px;
    display: none; /*******if you delete this, your drop down menu will appear randomly on the page somewhere **/
    position: absolute;
    font-family:Century Gothic, Helvetica, sans-serif;
    }

    #menu ul li a { /*This is the drop down stufff */
    text-align:left;
    float:right;
    background:none;
    margin:0px 0 -10px -35px;
    padding:0 0 0 20px;
    font-size:10px;

    }

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

    /*end drop-down menus on the top menu*/

    /*Featured Section */

    #top_content {
    width:1000px;
    margin:auto;
    border-bottom:2px solid #CCCCCC;
    }

    #featured_posts {
    width:960px;
    height:20px;
    margin:0px auto;
    padding:0;
    clear:both;

    }

    #featured_posts p {
    font-size:16px;
    padding:0;
    text-decoration:none;
    text-align:center;
    font-family:Century Gothic, Helvetica, sans-serif;
    color:#666;

    }

    #list {
    width:100%;
    margin:0;
    padding:0;
    overflow:hidden;

    }

    .slider {
    float:left;
    margin:0;
    position:relative;
    visibility:hidden;
    width:100%;
    height:109px;
    border-top:3px solid #000;
    border-bottom:3px solid #000;
    border-left:0px solid #000;
    border-right:0px solid #000;
    overflow:hidden;

    }

    /* this controls the space between the posts */

    .slider ul li {
    padding:0; /*control space between the images */
    border-right:3px solid #000;

    }

    .slider ul li img {
    cursor:pointer;
    height:109px;
    width:165px;
    padding:0;

    }

    /* end Featuerd Section */

    /************************************************
    CAPTIFY CAPTION
    ************************************************/
    .caption-top, .caption-bottom {
    background: #000000;
    color: #ffffff;
    cursor:default;
    padding:2px;
    font-size:11px;
    text-align:center;
    }

    .caption-top {
    border-width:0px;
    }

    .caption-bottom {
    border-width:0px;
    }

    .caption a, .caption a {
    background:#000;
    border:none;
    text-decoration:none;
    padding:2px;
    }

    .caption a:hover, .caption a:hover {
    background:#202020;
    }

    /*end*/
    /*begin menu navigation flower */
    body#home a#homenav,
    body#products a#prodnav,
    body#faq a#faqnav,
    body#contact a#connav {
    color: #fff;
    background: #930;
    }
    /* end */

    /*start header section containing sociables, search, profile, etc*/

    #header_bottom {
    width:1000px;
    display:block;
    clear:both;
    }

    #page_line {
    height:2px;
    width:1000px;
    display:block;
    clear:both;
    }

    #header_bottom_right {
    float:left;
    display:inline;
    width:65%;
    padding:7px 0 0 0;
    font-size:14px;
    }

    #header_bottom_left {
    float:left;
    display:inline;
    width:30%;
    }

    .profile_vert {
    width:50%;
    clear:none;
    }

    .profile_vert img {
    cursor:pointer;
    height:160px;
    width:240px;
    margin:20px 0 20px 25px;
    }

    .profile_ls img {
    cursor:pointer;
    height:240px;
    width:160px;
    padding:0;
    margin:
    }

    /*end header section containing sociables, search, profile, etc*/

    /*start widgetized footer */

    .footer {
    height:100%;
    width:1000px;
    background-color:#ffffff;
    position:relative;
    float:left;
    padding:10px 0 10px 0;
    border-top:1px solid #999;

    }

    .grid_4 h2 {
    color:#333333;
    clear:both;

    }

    .grid_4 a {
    color:#999999;
    }

    .grid_4 a:hover {
    color:#000000;
    }

    .grid_4 li {
    list-style:none;
    margin:0;
    padding:0;
    color:#999999;
    }

    .grid_4 ul {
    list-style:none;
    margin:0;
    padding:7px 0;
    }

    .recentcomments, #recentcomments {
    float:left;
    margin:0;
    padding:7px 0;
    }

    .widget widget_recent_entries {
    margin:0;
    padding:0;
    }

    /* Body >> Footer Blog Roll
    —————————————————————————————————-*/
    .footer ul.blogroll li a {
    color:#999;
    background: url(images/arrow.gif) 2% 50% no-repeat;
    }
    .footer ul.blogroll li a:hover {
    color:#000;
    background:url(images/arrow.gif) 2.5% 50% no-repeat;
    text-decoration:none;
    }

    .footer h2 {
    margin:0;
    }
    /* Body >> Footer Blog Roll
    —————————————————————————————————-*/

    .footer ul.blogroll {margin:0; padding:0; list-style:none; list-style-position:inside;}
    .footer ul.blogroll li {margin-bottom:2px; }
    .footer ul.blogroll li {width:140px;float:left; line-height:15px;}
    .footer ul.blogroll li a {display:block;padding:5px 10px 5px 20px; }
    .footer ul.blogroll li a:hover {}

    /* Body >> Recent Comments
    —————————————————————————————————-*/

    ul.recentcomment { margin:0; padding:0; list-style:none; }
    ul.recentcomment li { display:block;margin-bottom:2px;padding:5px 10px 5px 0px; overflow:hidden; height:100%;}

    ul.recentcomment li span {display:block;}

    ul.recentcomment li a {
    color:#999;
    }
    ul.recentcomment li a:hover {
    color:#000;
    text-decoration:none;
    }

    #sidebar { /*Note: this theme does not utilize a sidebar in the traditional sense. Instead, it is used as part of the footer */
    width:1000px;
    margin:auto;
    }
    /*end widgetized footer */

    /* Begin Lists */

    html>body .entry ul {
    margin-left: 0px;
    padding: 0 0 0 30px;
    list-style: none;
    padding-left: 10px;
    text-indent: -10px;
    }

    html>body .entry li {
    margin: 7px 0 8px 10px;
    }

    .entry ul li:before, #sidebar ul ul li:before {
    : “0BB 020”;
    }

    .entry ol {
    padding: 0 0 0 30px;
    margin: 0;
    }

    .entry ol li {
    margin: 0;
    padding: 0;
    }

    .postmetadata ul, .postmetadata li {
    display: inline;
    list-style-type: none;
    list-style-image: none;
    }

    /* End Entry Lists */

    /* Begin Form Elements */
    /* 2.2.3 Search */

    #search1 { background:#ffffff no-repeat; height:25px; width:165px; margin:9px 3px 0px 0; position:relative; float:left; display:inline;}
    #search1 input { background:none; border:none; width:154px; margin:4px 0 0 5px; font-size:12px; color:#9d9d9d; }
    #search1 input.submit { position:absolute; right:8px; top:5px; width:15px; height:16px; padding:0; margin:0; }

    #rss{margin:7px 0px 5px 0; display:inline; clear:none; float:left; display:inline;}

    #menu_right {float:right; overflow:hidden; height:100%; width:222px; display:inline;}

    .share_here {
    margin:25px 0 0 32px;
    float:left;

    }

    .shareit-box h2{
    margin:10px 0 0 0;
    padding:0;

    }

    .entry form { /* This is mainly for password protected posts, makes them look better. */
    text-align:center;
    }

    select {
    width: 130px;
    }

    #commentform input {
    width: 170px;
    padding: 2px;
    margin: 5px 5px 1px 0;
    }

    #commentform {
    margin: 5px 10px 0 0;
    }
    #commentform textarea {
    width: 100%;
    padding: 2px;
    }
    #respond:after {
    : “.”;
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
    #commentform #submit {
    margin: 0 0 5px auto;
    float: right;
    clear:both;
    }
    /* End Form Elements */

    /* Begin Comments*/
    .alt {
    margin: 0;
    padding: 10px;
    }

    .commentlist {
    padding: 0;
    text-align: justify;
    }

    .commentlist li {
    margin: 15px 0 10px;
    padding: 5px 5px 10px 10px;
    list-style: none;

    }
    .commentlist li ul li {
    margin-right: -5px;
    margin-left: 10px;
    }

    .commentlist p {
    margin: 10px 5px 10px 0;
    }
    .children { padding: 0; }

    #commentform p {
    margin: 5px 0;
    }

    .nocomments {
    text-align: center;
    margin: 0;
    padding: 0;
    }

    .commentmetadata {
    margin: 0;
    display: block;
    }
    /* End Comments */

    /* Various Tags & Classes */

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

    acronym, abbr, span.caps {
    cursor: help;
    }

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

    blockquote {
    margin: 15px 30px 0 10px;
    padding-left: 20px;
    border-left: 5px solid #ddd;
    }

    blockquote cite {
    margin: 5px 0 0;
    display: block;
    }

    .center {
    text-align: center;
    }

    .hidden {
    display: none;
    }

    .screen-reader-text {
    position: absolute;
    left: -1000em;
    }
    hr {
    display: none;
    }

    a img {
    border: none;
    }

    .navigation {
    display: block;
    text-align: center;
    margin-top: 10px;
    margin-bottom: 60px;
    }

    .slideshows {
    width:750px;
    height:auto;
    margin:auto;
    padding:none;
    }
    /* End Various Tags & Classes*/

    /*grid CSS */

    /*
    Variable Grid System.
    Learn more ~ http://www.spry-soft.com/grids/
    Based on 960 Grid System – http://960.gs/

    Licensed under GPL and MIT.
    */

    /* Containers
    —————————————————————————————————-*/
    .container_12 {
    margin-left: auto;
    margin-right: auto;
    width: 996px;
    }

    /* Grid >> Global
    —————————————————————————————————-*/

    .grid_1,
    .grid_2,
    .grid_3,
    .grid_4,
    .grid_5,
    .grid_6,
    .grid_7,
    .grid_8,
    .grid_9,
    .grid_10,
    .grid_11,
    .grid_12 {
    display:inline;
    float: left;
    position: relative;
    margin-left: 10px;
    margin-right: 10px;
    }

    /* Grid >> Children (Alpha ~ First, Omega ~ Last)
    —————————————————————————————————-*/

    .alpha {
    margin-left: 0;
    }

    .omega {
    margin-right: 0;
    }

    /* Grid >> 12 Columns
    —————————————————————————————————-*/

    .container_12 .grid_1 {
    width:63px;
    }

    .container_12 .grid_2 {
    width:146px;
    }

    .container_12 .grid_3 {
    width:229px;
    }

    .container_12 .grid_4 {
    width:312px;
    }

    .container_12 .grid_5 {
    width:395px;
    }

    .container_12 .grid_6 {
    width:478px;
    }

    .container_12 .grid_7 {
    width:561px;
    }

    .container_12 .grid_8 {
    width:644px;
    }

    .container_12 .grid_9 {
    width:727px;
    }

    .container_12 .grid_10 {
    width:810px;
    }

    .container_12 .grid_11 {
    width:893px;
    }

    .container_12 .grid_12 {
    width:976px;
    }

    /* Prefix Extra Space >> 12 Columns
    —————————————————————————————————-*/

    .container_12 .prefix_1 {
    padding-left:83px;
    }

    .container_12 .prefix_2 {
    padding-left:166px;
    }

    .container_12 .prefix_3 {
    padding-left:249px;
    }

    .container_12 .prefix_4 {
    padding-left:332px;
    }

    .container_12 .prefix_5 {
    padding-left:415px;
    }

    .container_12 .prefix_6 {
    padding-left:498px;
    }

    .container_12 .prefix_7 {
    padding-left:581px;
    }

    .container_12 .prefix_8 {
    padding-left:664px;
    }

    .container_12 .prefix_9 {
    padding-left:747px;
    }

    .container_12 .prefix_10 {
    padding-left:830px;
    }

    .container_12 .prefix_11 {
    padding-left:913px;
    }

    /* Suffix Extra Space >> 12 Columns
    —————————————————————————————————-*/

    .container_12 .suffix_1 {
    padding-right:83px;
    }

    .container_12 .suffix_2 {
    padding-right:166px;
    }

    .container_12 .suffix_3 {
    padding-right:249px;
    }

    .container_12 .suffix_4 {
    padding-right:332px;
    }

    .container_12 .suffix_5 {
    padding-right:415px;
    }

    .container_12 .suffix_6 {
    padding-right:498px;
    }

    .container_12 .suffix_7 {
    padding-right:581px;
    }

    .container_12 .suffix_8 {
    padding-right:664px;
    }

    .container_12 .suffix_9 {
    padding-right:747px;
    }

    .container_12 .suffix_10 {
    padding-right:830px;
    }

    .container_12 .suffix_11 {
    padding-right:913px;
    }

    /* Push Space >> 12 Columns
    —————————————————————————————————-*/

    .container_12 .push_1 {
    left:83px;
    }

    .container_12 .push_2 {
    left:166px;
    }

    .container_12 .push_3 {
    left:249px;
    }

    .container_12 .push_4 {
    left:332px;
    }

    .container_12 .push_5 {
    left:415px;
    }

    .container_12 .push_6 {
    left:498px;
    }

    .container_12 .push_7 {
    left:581px;
    }

    .container_12 .push_8 {
    left:664px;
    }

    .container_12 .push_9 {
    left:747px;
    }

    .container_12 .push_10 {
    left:830px;
    }

    .container_12 .push_11 {
    left:913px;
    }

    /* Pull Space >> 12 Columns
    —————————————————————————————————-*/

    .container_12 .pull_1 {
    left:-83px;
    }

    .container_12 .pull_2 {
    left:-166px;
    }

    .container_12 .pull_3 {
    left:-249px;
    }

    .container_12 .pull_4 {
    left:-332px;
    }

    .container_12 .pull_5 {
    left:-415px;
    }

    .container_12 .pull_6 {
    left:-498px;
    }

    .container_12 .pull_7 {
    left:-581px;
    }

    .container_12 .pull_8 {
    left:-664px;
    }

    .container_12 .pull_9 {
    left:-747px;
    }

    .container_12 .pull_10 {
    left:-830px;
    }

    .container_12 .pull_11 {
    left:-913px;
    }

    /* Clear Floated Elements
    —————————————————————————————————-*/

    /* http://sonspring.com/journal/clearing-floats */

    .clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
    }

    /* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

    .clearfix:after {
    clear: both;
    content: ‘ ‘;
    display: block;
    font-size: 0;
    line-height: 0;
    visibility: hidden;
    width: 0;
    height: 0;
    }

    .clearfix {
    display: inline-block;
    }

    * html .clearfix {
    height: 1%;
    }

    .clearfix {
    display: block;
    }

    /* Body >> Share Post
    —————————————————————————————————-*/
    .shareit-box {
    padding:20px;
    clear:both;
    overflow:hidden;
    height:100%;
    }

    .shareit-box h2 {float:left;display:inline-block;}
    .shareit-box ul {margin:0;padding:0; list-style:none; float:right;}
    .shareit-box li {display:inline; float:left; padding:2px; margin:2px;}
    .shareit-box li a img {width:32px; height:32px;}
    /* Body >> Share Post
    —————————————————————————————————-*/
    .shareit-box {
    background:#f5f5f5;
    border:1px solid #ddd;
    }

    .shareit-box h2, related-post h2 {
    border-bottom:tranparent;
    }

    .shareit-box h2, { font:bold 18px “Trebuchet MS”,Tahoma, verdana,sans-serif; margin:10px 0; }

Viewing 1 replies (of 1 total)
Viewing 1 replies (of 1 total)
  • The topic ‘Transparent background’ is closed to new replies.