KnowledgeHub
Questions
Tags
Users
Search
Alex Rivera
|
Logout
Edit Question
Title
Body
I'm trying to design some HTML/CSS that can put a border around specific rows in a table. Yes, I know I'm not really supposed to use tables for layout but I don't know enough CSS to completely replace it yet. Anyways, I have a table with multiple rows and columns, some merged with rowspan and colspan, and I'd like to put a simple border around parts of the table. Currently, I'm using 4 separate CSS classes (top, bottom, left, right) that I attach to the <td> cells that are along the top, bottom, left, and right of the table respectively. .top { border-top: thin solid; border-color: black; } .bottom { border-bottom: thin solid; border-color: black; } .left { border-left: thin solid; border-color: black; } .right { border-right: thin solid; border-color: black; } <html> <body> <table cellspacing="0"> <tr> <td>no border</td> <td>no border here either</td> </tr> <tr> <td class="top left">one</td> <td class="top right">two</td> </tr> <tr> <td class="bottom left">three</td> <td class="bottom right">four</td> </tr> <tr> <td colspan="2">once again no borders</td> </tr> <tr> <td class="top bottom left right" colspan="2">hello</td> </tr> <tr> <td colspan="2">world</td> </tr> </table> </html> Is there any easier way to do what I want? I tried applying top and
Tags (comma-separated)
Save Edits
Cancel