DTP


 
Lively discussions on the graphic arts and publishing — in print or on the web


Go Back   Desktop Publishing Forum > General Discussions > Web Design

 
 
Thread Tools Display Modes
Prev Previous Post   Next Post Next
Old 08-06-2007, 11:22 AM   #1
ktinkel
Founding Sysop
 
ktinkel's Avatar
 
Join Date: Oct 2004
Location: In Connecticut, on the Housatonic River near its mouth at Long Island Sound.
Posts: 11,187
Default CSS & Tables

I ran across an old-fashioned inline HTML-type table (scroll down to the table) on the web and decided that I needed to figure out how to control tables with CSS.

I wanted to create a liquid page with a table controlled by CSS. I uploaded my first attempt.

It took quite a while — I kept running into seemingly unsolveable problems:
  • Each of the subheads (“Type of stitches,” etc.) should have its own row. But I couldn’t do it within the table. I tried colspan but it didn’t work properly, or at least not as I would have expected: it left out the dividers across the line but added three little boxes to the right end of the row, outside the table. Ugly.
    .
  • Then I tried making separate tables, breaking before each of the subtitles (which I marked H2 and styled). But then I had several individual tables, and their columns didn’t match up. Ugh again.
    .
  • So I ended up adding the subhds as part of the first TD line, using BR to force the second part of the line down. That worked, sort of, but the subhds were too close to the first line below and I couldn’t figure out how to add space between the two lines. So I changed the line-height. Kind of a kludge, but it works visually in my browsers.
    .
  • I tried using list for the entries down the side, but couldn’t figure out how to do that and the table and its columns as well. Is that the right approach, though?
    .
  • I tried using border-collapse: collapse to minimize the boxiness. I really wanted to eliminate the box around the the whole table (just retain horizontals and interior verticals) but couldn’t figure out how to do that either (border: none was simply ignored).
But it sort of works. Anyone know better ways?

P.S. — The thing validates as XHTML 1.0 Strict.

   
__________________
[SIZE=2][COLOR=LemonChiffon]::[/COLOR][/SIZE]
[SIGPIC][/SIGPIC]
ktinkel is offline   Reply With Quote
 

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
tables + InDesign FlipSide Print Design 9 12-12-2006 06:58 PM
InDesign problem with merged cells in tables iskreto Print Design 7 12-06-2006 09:53 AM
Quark and InDesign tables: Hidden feature? bmann Print Design 4 10-30-2006 12:30 PM
InDesign tables Adrian Print Design 1 10-11-2006 02:54 PM


All times are GMT -8. The time now is 09:20 PM.


Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
Contents copyright 2004–2019 Desktop Publishing Forum and its members.