Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

How can I code CSS to make Table like?

How can I code CSS to make Table like?

Problem

I want to make the Tags list just like this below.
I want to use CSS instead of using Table tag.
How can I do this?

Tags: Apple Banana Melon Strawberry Kiwi Orange 
      Pineapple Carrot Onion Tomato Bacon Sandwitch
      SoyBeans Pork Beef Chicken 
Problem courtesy of: cat

Solution

You can do it like this:

HTML:

Tags:
Apple Banana Melon Strawberry Kiwi Orange Pineapple Carrot Onion Tomato Bacon Sandwitch SoyBeans Pork Beef Chicken

CSS:

.left, .right
{
color:#2B91AF;
}

.left
{
  float: left;
  width: 30px; //adjust this width according to your needs
  margin-right: 10px; //adjust this margin according to your needs
}

.right
{
  float: left;
  width: 400px; //adjust this width according to your needs
}

Here is a fiddle just because it's nice: http://jsfiddle.net/VQjGW/

Solution courtesy of: Ivozor

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

How can I code CSS to make Table like?

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×