CODEWITHSUNDEEP
htmlcssmarkdown
TonyMan
TonyMan

Reputation: 283

How to get rid of table borders in markdown?

This is my markdown code

| Time         | Length        | Speed              | Mass         |    
|--------------|---------------|--------------------|--------------|
| Millisecond  | Millimetre    | Kilometre per hour | Milligram    |   
| Second       | Centimetre    | Foot per second    | Gram         |  
| Minute       | Inch          | Miles per hour     | Ounce        |     
| Hour         | Foot          | Knot               | Pound        |  
| Day          | Yard          | Metre per second   | Kilogram     |  
| Week         | Metre         |                    | Us ton       |  
| Month        | Kilometre     |                    | Tonne        |  
| Year         | Mile          |                    | Imperial ton |  
| Decade       | Nautical mile |                    |              |  
| Century      |               |                    |              |  
| Millennium   |               |                    |              |

Output:

Time Length Speed Mass
Millisecond Millimetre Kilometre per hour Milligram
Second Centimetre Foot per second Gram
Minute Inch Miles per hour Ounce
Hour Foot Knot Pound
Day Yard Metre per second Kilogram
Week Metre Us ton
Month Kilometre Tonne
Year Mile Imperial ton
Decade Nautical mile
Century
Millennium

I was wondering if it was possible to make it so that the table has no borders.

Upvotes: 27

Views: 42072

Answers (3)

aurelien
aurelien

Reputation: 423

Just add :

<style>
table {
    border-collapse: collapse;
}
table, th, td {
   border: none;
}
blockquote {
    border-left: none;
    padding-left: 10px;
}
</style>

| Column One    | Column Two    |                                                                                                                                                   
| ---           | ---           |                                                                                                                                                   
| data cell one | data cell two |

And you will obtain a nice, function table with all borders of all cells.

Upvotes: 0

Ron Erlih
Ron Erlih

Reputation: 171

You can try to add a <style> tag at the top of your markdown file with rules to remove the border on <td> and <tr> elements.

But unfortunately I noticed it will only work locally on a preview. Github sanitizes the inline style and script tags

<style>
td, th {
   border: none!important;
}
</style>


| Time         | Length        | Speed              | Mass         |
| ------------ | ------------- | ------------------ | ------------ |
| -Millisecond | Millimetre    | Kilometre per hour | Milligram    |
| Second       | Centimetre    | Foot per second    | Gram         |
| Minute       | Inch          | Miles per hour     | Ounce        |

screenshot

Upvotes: 17

blami
blami

Reputation: 7411

There's no mechanism in Markdown itself to hide table borders. You can override table CSS styles for generated HTML, but that will work only if you have access to CSS.

For services like Github where CSS styles are predefined by service owner and cannot be overriden the table borders simply cannot be hidden.

Upvotes: 30

Related Questions