How do I line up my post titles in this grid? [closed]

Question

hopefully you can help me. I think this problem is pretty simple.

I created a grid with 3 columns.

Each column retrieves and displays 3 posts from a different category.

My problem is 2 fold:

1 - The post titles don't line up in a nice grid fashion.

2 - There is no padding between the excerpt and the post title under it.

I've been trying to make the columns display their posts horizonally rather that vertically (This would solve both problems) but I can't figure it out.

You can see the grid here: http://www.restlesscities.com/

Here is a link to my code since I can't seem to copy and paste it using the "code" functionality.

Answer 1

You can make use of 960 grid or twitter bootstrap.

For Twitter botostrap add span4 class in a row.. That will make sure that 3 posts will come in a row (since 4x3 = 12).

I would suggest you to use Bootstrap or Reverie framework. Don't just start from a scratch. Get started with some very good foundation. It will help you to boost your development.

To add some padding between Title and Excerpt, just add "padding-bottom" property in css for title and give something padding as per your needs.

Again, if you want to develop a really solid, cross platform compatible theme, get started with Bootstrap or Reverie framework.. It will help you a lot.

Regards,

Rahul Patil