• Author
  • #1323892


    How to get two post side by side like this
    I have a Twenty ten theme and very new to coding

    The blog I need help with is



    That’s not just “two posts side by side”, it’s the masonry layout, and there’s no point in trying to simulate this on Twenty Ten: select a theme that already uses the masonry layout – for example Imbalance 2 or Visual.
    Or you might be interested in a grid layout theme – for example Suburbia or The Columnist.
    There are also themes that literally do/can display two posts side by side – for example Chateau or Inuit Types.

    You can read about all themes and see them in action here:
    (Careful: some themes have multiple layouts, so some demos are one version only).


    There is not a way to make a theme that isn’t already using the masonry script justpi mentioned unless it’s already built into the theme, but you could make the posts into a grid if you wanted.

    Here is an example you can start with:

    .home .hentry {
    	border: 1px solid black;
    	border-radius: 8px;
    	width: 29%;
    	margin-right: 1%;
    	padding: 1%;
    	float: left;

    That will give each post on the home page a border and make it about 1/3 the width of it’s container element.

    To take that example a bit further, you can add some padding on the container element to make the spacing a little nicer, update the font size for post titles so they fit better inside the boxes, and make the images a bit smaller to they don’t fall over into the box margin areas:

    .home #content {
    	padding-left: 3%;
    .home .hentry .entry-title a {
    	font-size: 75%;
    .home .hentry img[class*="align"],
    .home .hentry img[class*="wp-image-"],
    .home .hentry #content .gallery .gallery-icon img {
    	max-width: 92.5%;

The topic ‘POST'S SIDE BY SIDE’ is closed to new replies.