Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Oct 2010
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image Post Divider

    My blog is http://www.jeannettekaufmannphotography.com/blog

    I'd like to add a image post divider between posts on my blog. I found a plugin in but I can't get it to work. The plug in is called Add a Separator. I'd like to either get the plugin to work or find code that will work. Thank you.

    Here is my CSS.



    /*
    Theme Name: PhotoLounge
    Theme URI: http://wordpress.org/
    Description: A sleek, practical, and user-friendly Photography Blog Theme by <a href="http://www.slrlounge.com">SLR Lounge</a>.
    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:#6281a3;
    }

    h1, h2, h3 {clear:both;}


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

    }

    .postmetadata {
    clear: center;}

    #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: white;
    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 40px;
    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: 18px;
    }

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


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

    h2, h2 a, h2 a:visited, h3 {
    color:#6281a3;
    }

    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:#291b18;
    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:11px;


    }

    #menu ul li a:hover {color:#6281a3;}

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

    /*Featured Section */

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

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


    }

    #featured_posts p {
    font-size:18px;
    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 {
    cursorointer;
    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 {
    cursorointer;
    height:160px;
    width:240px;
    margin:20px 0 20px 25px;
    }

    .profile_ls img {
    cursorointer;
    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 #6281a3;

    }

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

    }


    .grid_4 a {
    color:#999999;
    }

    .grid_4 a:hover {
    color:#6281a3;
    }

    .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:#291b18;
    background: url(images/arrow.gif) 2% 50% no-repeat;
    }
    .footer ul.blogroll li a:hover {
    color:#6281a3;
    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:#291b18;
    }
    ul.recentcomment li a:hover {
    color:#6281a3;
    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 {
    : "\00BB \0020";
    }

    .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/200...arfix-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:none;
    }

    .shareit-box h2, { font:bold 18px "Trebuchet MS",Tahoma, verdana,sans-serif; margin:10px 0; }
    Last edited by JeannetteKP; 10-20-2010 at 04:52 PM. Reason: Adding CSS

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,861
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    You don't need to have an extra plugin or any php/html code to add a separator in between posts. Setting a border to div.post{ } in CSS would be enough!
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •