i hate loving divs..

[mikeman]

their great tools but a pain in my butt..

im trying to make a div thingy that looks like this

http://ocixx.com/joseph/wp-content/uploads/2011/09/div.png

i indent on eventually putting two of thos side by side.. i want to use it to display song title – artist and then a Buy button, bting the far right boxes.

could anyone help me out?

[TheDoc]

Looks a hell of a lot like a table!

[chrisburton]

“div thingy” is my new phrase.

[thomas]

To the people saying to “just use a table,” you may be right, but let’s suppose for a minute that the image @mikeman provided was for the layout of a proposed website. In that case, <div>s or more semantic elements would be more appropriate.

Here’s some quick code for a general idea of how to create that type of layout:

#left-col {

float: left;

width: 300px;

}

#right-col {

margin-left: 300px;

width: 100px;

}

.row {

height: 20px;

border: 1px solid #000;

border-bottom-width: 0;

}

.row:last-child {

border-bottom-width: 1px;

}

#left-col .row {

border-right-width: 0;

}

footer {

clear: both;

width: 398px;

height: 50px;

border: 1px solid #000;

border-top-width: 0;

http://jsfiddle.net/bFV4c/

[chrisburton]

@thomas, he stated he was going to display artists and song titles, a perfect use for tables.

[thomas]

@ChristopherBurton, right, and I would probably use a table as well, but without actually seeing the information he is putting into it, it’s really a matter of opinion of whether it would be considered tabular data or not.

I posted the code as an example to others that might find it useful who may not be creating a layout that is best represented by a table.

[thomas]

@Adman, I didn’t check his website, and I’d like to reiterate that I’m not suggesting that tables aren’t the right approach for this.

The example I gave was to create the layout he requested, not to spark a debate about the semantics of tables.

[chrisburton]

@thomas “right, and I would probably use a table as well, but without actually seeing the information he is putting into it, it’s really a matter of opinion of whether it would be considered tabular data or not.“

He did and this is what he wrote in his original post:

“im trying to make a div thingy that looks like this
http://ocixx.com/joseph/wp-content/uploads/2011/09/div.png

i want to use it to display song title – artist and then a Buy button, bting the far right boxes.“

…perfect use for tables

[thomas]

@ChristopherBurton, it looks like you’re getting hung up on whether this is a good use case for tables, and I’ve already made it very clear that I agree it is.

As for my statement of not seeing the information he will be using in that layout, it still stands. To “display song title – artist and then a Buy button” is not enough information to know what the finished version of that layout will look like. What if he includes a description, images, links to reviews, etc.? Maybe a table would still be the best choice, but you’re starting to enter a gray area. I’m giving him the benefit of the doubt.

At any rate, I consider the original question of how to recreate the layout solved, and now we’re veering off topic.

Final disclaimer: I do not advocate the use of excessive divs to recreate tabular markup. A table is the semantically appropriate element for tabular data.

[chrisburton]

No one is fighting? Lol

But it’s quite simple, he would have explained that in the original post in which he didn’t.
Your argument is “what if” and originially made this off topic by marking up the incorrect solution that was already solved. That’s all I really have to say.

[Author]

Posts