WordPress.org

Ready to get started?Download WordPress

Forums

WordPress Popular Posts
cant get alignment on everything right (6 posts)

  1. jmckiernan86
    Member
    Posted 11 months ago #

    I've messed around with the css for a while now but can't seem to figure it out. I can't get everything to line up neatly to the left.
    Here's the site - http://cnainfo.net/

    I just went back to using the default css here:

    .wpp-list { /* UL element */
    
    }
    
    	.wpp-list li { /* LI - post container */
    		overflow:auto;
    		display:block;
    		float:none;
    		clear:both;
    	}
    
    		/* title styles */
    		.wpp-post-title {
    		}
    
    		/* thumbnail styles */
    		.wpp-thumbnail {
    			display:inline;
    			float:left;
    			margin:0 5px 0 0;
    			border:none;
    		}
    
    		/* excerpt styles */
    		.wpp-excerpt {
    		}
    
    		/* Stats tag styles */
    		.post-stats {
    			font-size:9px;
    			font-weight:bold;
    		}
    
    			.wpp-comments {
    			}
    
    			.wpp-views {
    			}
    
    			.wpp-author {
    				font-style:italic;
    			}
    
    			.wpp-date {
    				display:block;
    				clear:right;
    			}
    
    		/* WP-PostRatings styles */
    		.wpp-rating {
    		}

    Thank you!

    http://wordpress.org/plugins/wordpress-popular-posts/

  2. Héctor Cabrera
    Member
    Plugin Author

    Posted 11 months ago #

    Hi there,

    Just checked your site and your HTML markup is not right. If you want to display your popular posts in an unordered list (UL), each popular item needs to be wrapped in LI tags. From the code, you just have the UL and a bunch of A tags together - which is why your list is displaying like that.

  3. jmckiernan86
    Member
    Posted 11 months ago #

    I tried both
    <li>{thumb}{title}</li>
    and

    <li>{thumb}</li>
    <li>{title}</li>

    but didn't have any luck

  4. Héctor Cabrera
    Member
    Plugin Author

    Posted 11 months ago #

    Alright, try the following:

    .popular-posts ul { /* UL element */
    
    }
    
    	.popular-posts ul li { /* LI - post container */
    		overflow:auto;
    		display:block;
    		float:none;
    		clear:both;
    	}
    
    		/* title styles */
    		.wpp-post-title {
    		}
    
    		/* thumbnail styles */
    		.wpp-thumbnail {
    			display:inline;
    			float:left;
    			margin:0 5px 0 0;
    			border:none;
    		}
    
    		/* excerpt styles */
    		.wpp-excerpt {
    		}
    
    		/* Stats tag styles */
    		.post-stats {
    			font-size:9px;
    			font-weight:bold;
    		}
    
    			.wpp-comments {
    			}
    
    			.wpp-views {
    			}
    
    			.wpp-author {
    				font-style:italic;
    			}
    
    			.wpp-date {
    				display:block;
    				clear:right;
    			}
    
    		/* WP-PostRatings styles */
    		.wpp-rating {
    		}
  5. jmckiernan86
    Member
    Posted 11 months ago #

    great that worked with one small change:
    `.wpp-thumbnail {
    align: left;
    `

    the only thing is now there's a margin on the left i can't get rid of.

  6. jmckiernan86
    Member
    Posted 11 months ago #

    oh and for some reason the titles won't style

    /* title styles */
    .wpp-post-title {
    text-decoration: none;
    }

    Im not sure if they're being overridden by my theme

Reply

You must log in to post.

About this Plugin

About this Topic

Tags

No tags yet.