The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> CSS Tables
asmith
post May 5 2009, 09:26 PM
Post #1


Advanced Member
****

Group: Members
Posts: 198
Joined: 26-December 07
Member No.: 4,586



Hi,

I've been searching for this for a while, probably with the wring keywords, I couldn't find exactly what I was looking for.

How do you write this table in CSS:

CODE
<table border="1">
<tr>
<td>content1</td><td>content2</td>
</tr>
<tr>
<td>content3</td><td>content4</td>
</tr>
</table>



I mean putting 4 divs for each cell. and How to stick those divs together? Is it as easy as tables? Works in all browsers?
Hope it is not with a simple float biggrin.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 6 2009, 12:37 AM
Post #2


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 15,565
Joined: 9-August 06
Member No.: 6



Could be floats. What in a table do you want to mimic? If you want the parts to depend on eachother as with a table, that won't happen anytime soon.


--------------------
"Never go to excess, but let moderation be your guide."
- Cicero

IPB Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
asmith
post May 6 2009, 01:33 AM
Post #3


Advanced Member
****

Group: Members
Posts: 198
Joined: 26-December 07
Member No.: 4,586



Thanks for the reply
I always thought there is a CSS equivalent to HTML table.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 6 2009, 01:43 AM
Post #4


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 15,565
Joined: 9-August 06
Member No.: 6



You can accomplish the look, but not the functionality. I'm referring to, using your example, how content1 would also stretch, get higher, if content2 got more content. That won't happen with DIVs.

If you just want two columns with two sections in each, no problem. But the DIVs won't depend on eachother, cross-column-wise or cross-row-wise. Clear as mud, huh? Sorry, but I don't find the words to express what I mean. I claim ESL! tongue.gif


--------------------
"Never go to excess, but let moderation be your guide."
- Cicero

IPB Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post May 6 2009, 06:14 AM
Post #5


.
********

Group: WDG Moderators
Posts: 6,154
Joined: 10-August 06
Member No.: 7



QUOTE(asmith @ May 6 2009, 04:26 AM) *

I mean putting 4 divs for each cell. and How to stick those divs together?

If you meant "putting 4 divs for each table", you can use the "display: table-cell" property: http://www.w3.org/TR/CSS21/tables.html#table-display

QUOTE
Is it as easy as tables?

Haven't used it much, but it may even be easier. happy.gif

QUOTE
Works in all browsers?

IE8 is said to support it, but not IE7 and older. Other modern browsers seem to support it.

As a workaround for IE6/7 you can sometimes use "display: inline-block" on inline (but not block) elements, but then you must give them an explicit width. Firefox2 and older don't support "inline-block", so separate style sheets are needed.




--------------------
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
asmith
post May 8 2009, 12:50 AM
Post #6


Advanced Member
****

Group: Members
Posts: 198
Joined: 26-December 07
Member No.: 4,586



lol tables ftw!

anyway, if table is outdated tag, if someone is using strict doc type, how can he achieve this 'stretchy-related' cells?

QUOTE
I claim ESL!

More here ^^
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post May 8 2009, 02:24 AM
Post #7


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 15,565
Joined: 9-August 06
Member No.: 6



No, tables aren't outdated at all. Just the misuse of them. IMO they are used to seldom today. Can your data be seen as tabular? Use a table.

But I assume this is a pure layout table, right?

QUOTE
More here ^^


Those darn Anglo-Saxons, huh? angry.gif tongue.gif


--------------------
"Never go to excess, but let moderation be your guide."
- Cicero

IPB Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
asmith
post May 8 2009, 03:23 AM
Post #8


Advanced Member
****

Group: Members
Posts: 198
Joined: 26-December 07
Member No.: 4,586



This isn't anywhere. It was a simple question.

I always liked tables. I guess mainly because the cells are stick together, So that I can "trust" them to stay where they should.

DIVs with floats or so, always scared me of their "moving" in different situations/browsers.

QUOTE
Those darn Anglo-Saxons, huh?

Sure biggrin.gif

This post has been edited by pandy: May 8 2009, 03:29 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 25th October 2014 - 12:30 AM