CODEWITHSUNDEEP
htmlcsshtml-listscss-tables
CamSpy
CamSpy

Reputation: 401

How to make a CSS table with use of DIV UL LI

Imagine, I have DIV container, 9 <ul> tags inside of it (they are columns), each <ul> tag has 5 <li> tags inside and each <li> tag has one link inside.

I want to make it pure CSS kind of a table where all <ul> widths would not need to have a hard width set, but vary and auto stretch relative to the lenght of links in <li> tags and in relation to the other <ul> tags, so some colums will be wider, some will be shorter if the links in them are long or short.

Can you help me with that? I was trying to make that and everything worked except the auto stretching <ul> tags, they had fixed widths :(

Upvotes: 0

Views: 20592

Answers (1)

Epik
Epik

Reputation: 3357

Hey i have a solution for you from what i can make out that you need here...

http://jsfiddle.net/YPmtG/4/

I am basically just floating the ul's and the li's are naturally hosted inside the ul so they can be individually floated inside there again as shown in my fiddle...

ul {
    float:left;
    clear:right;
    padding:5px;
}
li {
    float:left;
    clear:left;
}

Upvotes: 2

Related Questions