Skip to main content
Inspiring
December 18, 2009
Answered

Table Border Problems...

  • December 18, 2009
  • 4 replies
  • 1700 views

I am embarrassed to ask this question, but I just can't seem to find the answer in any of my books.

I have a multi-row table defined with borders and there are two problems:

  • When the subsequent row is added to the current table row, the border between the two rows is doubled.  BORDER="1" is fine around the edges; there's just this annoying doubled line between the rows.  I've tried BORDER="1,1,0,1", but that didn't work at all.

The next roblem I wouldn't have noticed except for the fact that I am setting a background color on the rows:

  • When there is no data in the row cell, there are no borders.  This leaves a really funky-looking display, because the populated cells have the border, and the unpopulated cells do not:  their border is white!

Here's the table definition:

<table align="center"

          border="1'

          bordercolor="blue"

          cellspacing="0"

          cellpadding="2"

          width="95%">

     <tr background="lightblue"

          color="black">

          <td width="125">

                    #StructData_Line.Common_Label#

          </td>

          etc.....  through several cells

     </tr>

</table>

Any suggestions?

    This topic has been closed for replies.
    Correct answer Daverms

    Hi,

    Another thing that surprised me is that CSS apparently doesn't support centering the table on the page? 

    It actually supports table centering, you need to try something like this,

    i) Create a class in your css like this,

    table.alignCenter {margin-left:auto; margin-right:auto;}

    ii) And in your coldfusion page call the defined class (in your <table> tag) as,

    <table class="alignCenter">

    The attachment shows the latest version, which still has the double-thickness line between the rows.

    Try adding,

    border:1px solid black;

    in all your <table>, <tr> class definitions of your CSS file like this,

    table

    {

         border: 1px solid darkblue;
         width: 90%;
         align: center;                                       
         border:1px solid black;
        border-collapse:collapse;
    }

    td

    {
        padding: 5px;
        border:1px solid black;

    }

    td.td1175

    {

        width: 175px;
        border:1px solid black;
        background: lightblue;
    }

    HTH

    4 replies

    sockerdadAuthor
    Inspiring
    December 19, 2009

    Here's the screen shot.  I'm going to try a couple of these suggestions and let you know.

    sockerdadAuthor
    Inspiring
    December 20, 2009

    It took a while, but now I am creating the table with CSS.  The attachment shows the latest version, which still has the double-thickness line between the rows.

    Another thing that surprised me is that CSS apparently doesn't support centering the table on the page?  (My coding is gleaned from Richard York's Beginning CSS 2nd Edition.)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

              "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    <head>

           <link rel="stylesheet" type="text/css" href="default.css" />

    </head>

    <html><body>

    <table align="center">

         <caption>

                       Conviction Display

         </caption><br>

         <tbody>

              <tr>

                   <td class="td1175">

                             <cfoutput>#StructConv_Line1.A01_Common_Label#</cfoutput>

                   </td>

              </tr>

    ...

    default.css:

    body {

    font-family: sans-serif;

    background: lightsalmon;

    }

    table {

    border: 1px solid darkblue;

    width: 90%;

    align: center;                                        <-------- this looks like it is ignored, because I had to specify it on the <table statement.

    border-collapse: collapse;

    }

    td {

    padding: 5px;

    }

    td.td1175 {

    width: 175px;

    background: lightblue;

    }

    DavermsCorrect answer
    Inspiring
    December 21, 2009

    Hi,

    Another thing that surprised me is that CSS apparently doesn't support centering the table on the page? 

    It actually supports table centering, you need to try something like this,

    i) Create a class in your css like this,

    table.alignCenter {margin-left:auto; margin-right:auto;}

    ii) And in your coldfusion page call the defined class (in your <table> tag) as,

    <table class="alignCenter">

    The attachment shows the latest version, which still has the double-thickness line between the rows.

    Try adding,

    border:1px solid black;

    in all your <table>, <tr> class definitions of your CSS file like this,

    table

    {

         border: 1px solid darkblue;
         width: 90%;
         align: center;                                       
         border:1px solid black;
        border-collapse:collapse;
    }

    td

    {
        padding: 5px;
        border:1px solid black;

    }

    td.td1175

    {

        width: 175px;
        border:1px solid black;
        background: lightblue;
    }

    HTH

    Inspiring
    December 19, 2009

    Put a non breaking space into table cells with no data.

    December 19, 2009

    You are setting the table border in HTML... a html border value of one does not mean that, 1; you still need to collapse the border. Either set the border value in css, or collapse the border.

    For example (Notice the the dot before MyTable: This is to define a class).

    .TableWhatever {border:1px solid #000000; boder-collapse:collapse;} Then add the following to your table tag <table class="TableWhatever"

    Or, another solution: Add this to the HTML tag. : <table style="border:1px solid #333; border-collapse:collapse;">

    You really should be using CSS to seperate your semantics from presentation... I would not add presentation code to my table code for example... it's just not good practice... you ought to be using CSS... this makes editing a universal appearance a breath, and gives your pages a similar look across your site...

    Inspiring
    December 19, 2009

    Hi,

    Can you please attach some screenshots here?.