Wrox Programmer Forums
|
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Dreamweaver (all versions) section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old July 9th, 2004, 04:49 PM
amc amc is offline
Authorized User
 
Join Date: Feb 2004
Posts: 27
Thanks: 0
Thanked 0 Times in 0 Posts
Default format table borders through CSS

I would like to have a table drawn with external border (one for the whole table) and one between each row (so, NO border between columns)

How is it to be done in CSS? Is it the table that has to be assigned the proper CCS style?

thanks
antonio
__________________
thanks
antonio
 
Old July 9th, 2004, 05:37 PM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Hi amc,

You can give the entire table a border, except for the bottom line. Then you can give each row a bottom border. Since you can't apply the border to the row, you'll have to apply it to individual cells. To make that work nicely, set cellpadding and cellspacing for the table to 0. The following example will show you what I mean:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" 
        content="text/html; charset=iso-8859-1" />
    <title>Table With Row Lines</title>
    <style type="text/css">
        table
        {
            border: 1px solid black;
            border-bottom: 0;
        }
        td
        {
            border-bottom: 1px solid black;
        }
    </style>
</head>
<body>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
</tr>
<tr>
  <td>4</td>
  <td>5</td>
  <td>6</td>
</tr>
<tr>
  <td>7</td>
  <td>8</td>
  <td>9</td>
</tr>
</table>
</body>
</html>
Hope this helps,

Imar
---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.
While typing this post, I was listening to: Laichzeit by Rammstein (Track 10 from the album: Herzeleid) What's This?
 
Old July 14th, 2004, 03:53 PM
amc amc is offline
Authorized User
 
Join Date: Feb 2004
Posts: 27
Thanks: 0
Thanked 0 Times in 0 Posts
Default

thanks, I will try.

In the meanwhile, I have found (in chapter 17 of CSS2 spec), an elegant way to define borders related to full-rows. It use a clause called rules, that works in HTML 4.0....

My IE (6.0.28) doesn't seem to recognise that word. Does someone know :

1) how to check what version of HTML does a IE recognises?
2) if IE 6 handles that, how to use it in a CSS?


thanks
antonio
 
Old July 14th, 2004, 04:20 PM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Rules *is* supported in IE; but it will apply to the HTML border, not the CSS border.

The following will display an HTML table, with 3 rows, and no lines between the columns
Code:
<table width="100%"  border="1" rules="rows">
<tr>
  <td>1</td>
  <td>4</td>
  <td>7</td>
</tr>
<tr>
  <td>2</td>
  <td>5</td>
  <td>8</td>
</tr>
<tr>
  <td>3</td>
  <td>dvdvdv</td>
  <td>9</td>
</tr>
</table>
If you want to know what features are supported in IE, take a look here:

http://msdn.microsoft.com/library/de...asp?frame=true

Cheers,

Imar

---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.
While typing this post, I was listening to: Undone - The Sweater Song (weezer cover) by Sonic Youth (From the album: Various) What's This?
 
Old July 15th, 2004, 01:24 AM
amc amc is offline
Authorized User
 
Join Date: Feb 2004
Posts: 27
Thanks: 0
Thanked 0 Times in 0 Posts
Default

This is it!! So I tried to apply things to CSS, wrongly

I have limited knowledge of both html and CSS (I use just to make my simple, static webpage), so I easily enter intro trouble

thanks for your help

thanks
antonio
 
Old July 15th, 2004, 12:52 PM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

You're welcome; glad it's working.

Learning (X)HTML and CSS in all their details is not always easy. The W3C site (http://www.w3.org) and the link I posted earlier will help you understand the "rules" (no pun intended) of Web design with XHTML and CSS.

Cheers,

Imar
---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.
While typing this post, I was listening to: Stop Whispering by Radiohead (Track 4 from the album: Pablo Honey) What's This?
 
Old August 28th, 2004, 06:43 AM
amc amc is offline
Authorized User
 
Join Date: Feb 2004
Posts: 27
Thanks: 0
Thanked 0 Times in 0 Posts
Default

I checked the http://msdn.microsoft.com/library/de...es/rules_0.asp

to gain better understanding. Now I wonder if it is possible to draw borders in ONE cell, just one cell...

thanks

thanks
antonio
 
Old August 28th, 2004, 10:19 AM
Imar's Avatar
Wrox Author
 
Join Date: Jun 2003
Posts: 17,089
Thanks: 80
Thanked 1,576 Times in 1,552 Posts
Default

Hi Antonio,

I don't think you can do that with the Rule property. However, you can use CSS to achieve the desired effect. You can use border (to influence all borders at once), or border-left -top -bottom and -right to set individual borders:
Code:
<table>
<tr>
  <td style="border: 1px solid black;">
    This celll has a black
    border around it.
  </td>
  <td style="border-left: 1px solid red;border-right: 1px solid green;">
    This celll has a red border on the left
    and a green border on the right.
  </td>
</tr>
</table>
HtH,

Imar
---------------------------------------
Imar Spaanjaars
Everyone is unique, except for me.





Similar Threads
Thread Thread Starter Forum Replies Last Post
'Table' does not contain a definition for 'BorderS AccessAasif@aol.com C# 2005 1 September 13th, 2008 03:08 AM
Scrolling table with CSS: Almost there! asearle XSLT 1 November 24th, 2007 10:13 AM
table borders scud-murphy Dreamweaver (all versions) 1 June 6th, 2006 12:57 PM
CSS for Table border. rupen CSS Cascading Style Sheets 2 March 29th, 2006 09:41 AM
CSS Table Definitions pjmair HTML Code Clinic 2 September 18th, 2003 08:25 PM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.