#1
  1. Always something else to learn
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2003
    Location
    PA
    Posts
    691
    Rep Power
    12

    CSS - Table Row Borders


    Hi all,

    At work we have this library catalog service that controls our pages, the only way I can have control over layout and design is by using our stylesheet.

    I am trying to have a line appear under each record on a results page. I have tried 2 different things. The first this this:

    TABLE.browseList { font-family: arial; font-size: 12px; border-collapse: separate; empty-cells: show; }
    TABLE.browseList TD { font-family: arial; font-size: 12px; }
    TABLE.browseList TR { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966;}
    TR.browseHeader { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; }
    TD.browseHeaderNum { font-family: arial; font-size: 12px; font-weight: bold; }
    TD.browseHeaderMark { font-family: arial; font-size: 12px; font-weight: bold; }
    TD.browseHeaderData { font-family: arial; font-size: 12px; font-weight: bold; }
    TD.browseHeaderMedia { font-family: arial; font-size: 12px; font-weight: bold; }
    TD.browseHeaderYear { font-family: arial; font-size: 12px; font-weight: bold; }
    TD.browseHeaderEntries { font-family: arial; font-size: 12px; font-weight: bold; }
    TD.browseHeaderRelevance { font-family: arial; font-size: 12px; font-weight: bold; }

    TR.browseSuperEntry { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966;}

    TR.browseEntry { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966;}
    TD.browseEntryNum { font-family: arial; font-size: 12px; font-weight: bold; }
    TD.browseEntryMark { font-family: arial; font-size: 12px; }
    TD.browseEntryData { font-family: arial; font-size: 12px; }
    TD.browseEntryMedia { font-family: arial; font-size: 12px; }
    TD.browseEntryYear { font-family: arial; font-size: 12px; }
    TD.browseEntryEntries { font-family: arial; font-size: 12px; }
    TD.browseEntryRelevance { font-family: arial; font-size: 12px; }

    TR.browseSubEntry { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966;}
    TD.browseSubEntryData { font-family: arial; font-size: 12px; }
    TD.browseSubEntryMedia { font-family: arial; font-size: 12px; }
    TD.browseSubEntryYear { font-family: arial; font-size: 12px; }
    TD.browseSubEntryEntries { font-family: arial; font-size: 12px; }
    TD.browseSubEntryRelevance { font-family: arial; font-size: 12px; }
    This has the border on the bottom of each row ... but it's not showing up.

    The other option I tried was this:

    TABLE.browseList { font-family: arial; font-size: 12px; empty-cells: show; border-spacing: 0; cell-spacing: 8 }
    TABLE.browseList TD { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TR.browseHeader { font-family: arial; font-size: 12px; font-weight: bold; }
    TD.browseHeaderNum { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseHeaderMark { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseHeaderData { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseHeaderMedia { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseHeaderYear { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseHeaderEntries { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseHeaderRelevance { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; padding: 8 }

    TR.browseSuperEntry { font-family: arial; font-size: 12px; }

    TR.browseEntry { font-family: arial; font-size: 12px; }
    TD.browseEntryNum { font-family: arial; font-size: 12px; font-weight: bold; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseEntryMark { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseEntryData { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseEntryMedia { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseEntryYear { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseEntryEntries { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseEntryRelevance { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }

    TR.browseSubEntry { font-family: arial; font-size: 12px; }
    TD.browseSubEntryData { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseSubEntryMedia { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseSubEntryYear { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseSubEntryEntries { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    TD.browseSubEntryRelevance { font-family: arial; font-size: 12px; border-bottom: 1px solid #999966; padding: 8 }
    This option works to an extent. The people who coded this results page weren't very consistent, so there are some cases where a <TD> tag has no data in it (ex <TD class="browseEntryMark"></TD>) In these cases the border doesn't show up under the cell.

    Can anyone suggest a better option? I'd prefer just to have the border show up for the entire row versus each cell, but I'll take anything right now.

    Please note, that I have no control over the number of classes, they are pre-defined. At the same time I can't define any new classes.
  2. #2
  3. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2003
    Location
    city of sin, state of the art
    Posts
    421
    Rep Power
    0
    hey!

    hmm i m kinda confused..

    can u attach some html or something to see the structure you are talking about...?

    that would be helpful
    "I hate quotations."
    -ralph waldo emerson-
  4. #3
  5. Always something else to learn
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2003
    Location
    PA
    Posts
    691
    Rep Power
    12
    The HTML is Database generated. See if this link works (it may only work internally)

    http://jac.jenkinslaw.org:2082/searc...g=crime&SORT=R

    If it does work, see how there is no underline under the checkboxes?

    If it doesn't work, let me know and I'll view page source in my browser and paste it here.
  6. #4
  7. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2003
    Location
    city of sin, state of the art
    Posts
    421
    Rep Power
    0
    Originally posted by talia679
    .. See if this link works (it may only work internally)

    http://jac.jenkinslaw.org:2082/searc...g=crime&SORT=R

    ..If it doesn't work, let me know and I'll view page source in my browser and paste it here.
    nope. didnt work

    yea! try attaching it here

    "I hate quotations."
    -ralph waldo emerson-
  8. #5
  9. Always something else to learn
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2003
    Location
    PA
    Posts
    691
    Rep Power
    12
    Here it is
    Attached Files
  10. #6
  11. Always something else to learn
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2003
    Location
    PA
    Posts
    691
    Rep Power
    12
    Guess you hit the same block I did ... see how crappy their code is? I have no idea how to work around it ... anyone else got any ideas?

IMN logo majestic logo threadwatch logo seochat tools logo