How would you code this?
Posted: 30 August 2008 10:51 AM   [ Ignore ]  
Grad Student
Rank
Total Posts:  100
Joined  11-26-2007

So I have a question regarding the markup and CSS of a project. How would you code this screenshot? I think a table is the way to go but the Problem is the horizontal background image (with the shadows). As you might know you cant give a <tr /> a background image. So I have two options:

A) slice the horizontal background of each <tr> into small images for each <td>

or

B) forget about the table and use <dl> but that would increase the markup and I don’t really like the idea :D

What do you suggest?

Here is the screenshot: http://storage.maximilianschoening.com/screeny_at2323.jpg

Profile
 
 
Posted: 30 August 2008 06:19 PM   [ Ignore ]   [ # 1 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  380
Joined  03-01-2006
maximilianschoening - 30 August 2008 10:51 AM

A) slice the horizontal background of each <tr> into small images for each <td>

It’s the same bg-image for each cell isn’t? Or is it supposed to have rounded corners - it’s a bit hard to tell? Either way, it’ll still be the same repeating bg-image for the three middle cells.

And yes, looks like tabular data to me (although it’s hard to tell cos you’ve blurred some of it out).

 Signature 

John Faulds - Tyssen Design | Member of EE Pro Network

Profile
 
 
Posted: 31 August 2008 11:20 AM   [ Ignore ]   [ # 2 ]  
Lab Assistant
Avatar
RankRank
Total Posts:  254
Joined  03-23-2006

Looks very much like a table to me. Though it is very hard to say from the blurry image you might even get away with some clever css and no bg-image.
Anyway have a look here for some CSS table ideas (#10 deals with bg-images in tables).

Here is a table equivalent to the CSS-Zen site and another list of table styling techniques.

Have a nice weekend!

Profile
 
 
Posted: 03 September 2008 01:12 PM   [ Ignore ]   [ # 3 ]  
Lab Technician
Avatar
RankRankRankRank
Total Posts:  1055
Joined  06-05-2007

You don’t have to use tables.  With a combination of Paragraphs, Span Classes and CSS you can achieve the same effect.  You can get the rounded corners by using spiffy corners.

 Signature 

grantmx | designs - design | development | photography | consulting | ee pro profile

Profile
 
 
Posted: 03 September 2008 03:14 PM   [ Ignore ]   [ # 4 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  380
Joined  03-01-2006
grantmx - 03 September 2008 01:12 PM

You don’t have to use tables.  With a combination of Paragraphs, Span Classes and CSS you can achieve the same effect.

Why would you do that if the data is in fact tabular in nature?

 Signature 

John Faulds - Tyssen Design | Member of EE Pro Network

Profile
 
 
Posted: 03 September 2008 04:41 PM   [ Ignore ]   [ # 5 ]  
Lab Technician
Avatar
RankRankRankRank
Total Posts:  1055
Joined  06-05-2007

#1. I hate tables.

#2. Its not necessarily solely tabular.

#3. I hate tables.

smirk

 Signature 

grantmx | designs - design | development | photography | consulting | ee pro profile

Profile
 
 
Posted: 03 September 2008 05:33 PM   [ Ignore ]   [ # 6 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  380
Joined  03-01-2006

Numbers 1 & 2 are completely irrational and actually detrimental to producing good work when faced with data that actually is tabular. Representing tabular data with any other sort of element is as bad as doing a layout structure with table elements.

As the original image is partly blurred out, it’s difficult to say what the data is but I’d say it’s highly likely that it is tabular in nature and therefore table elements would be the correct ones to use. But as the original poster hasn’t returned to clarify the issue, it’s impossible to say for certain.

blank stare

 Signature 

John Faulds - Tyssen Design | Member of EE Pro Network

Profile
 
 
Posted: 03 September 2008 05:37 PM   [ Ignore ]   [ # 7 ]  
Lab Technician
Avatar
RankRankRankRank
Total Posts:  1055
Joined  06-05-2007

Numbers 1 & 2 are completely irrational and actually detrimental to producing good work when faced with data that actually is tabular. Representing tabular data with any other sort of element is as bad as doing a layout structure with table elements.


You certainly have a right to your opinion, no matter how rude the tone may be, Sir.

 Signature 

grantmx | designs - design | development | photography | consulting | ee pro profile

Profile
 
 
Posted: 03 September 2008 06:09 PM   [ Ignore ]   [ # 8 ]  
Research Assistant
Avatar
RankRankRank
Total Posts:  380
Joined  03-01-2006

And you certainly have a right to your opinion that you think I’m being rude. I didn’t think I was.

 Signature 

John Faulds - Tyssen Design | Member of EE Pro Network

Profile
 
 
   
 
 
Post Marker Legend
New Topic New posts Hot Topic Hot Topic with new posts New Poll New Poll Moved Topic Moved Topic Sticky Topic Sticky topic
Old Topic No new posts Hot Old Topic Hot Topic with no new posts Old Poll Old Poll Closed Topic Closed Topic Announcement Announcements
Theme
Change Theme
Visitor Statistics
The most visitors ever was 1149, on July 16, 2007 09:33 AM
Total Registered Members: 64912 Total Logged-in Users: 27
Total Topics: 81863 Total Anonymous Users: 19
Total Replies: 440100 Total Guests: 197
Total Posts: 521963    
Members ( View Memberlist )
Newest Members:  bjmohrAqua193Bios Elementmjpoteetguimogranwelshmrcfthenetmonkeybenekwhobutsb