CODEWITHSUNDEEP
htmlcsshtml-table
malin
malin

Reputation: 13

HTML Tables - borders not showing

Yes, I have searched. I have Googled. I have asked others. No answer so far.

I am trying to make a table in a code where there are other tables.

    .btlTable{
        border: 1px solid #A4A4A4;}
    /*  Table Styling */
    table {width: 100%; border-collapse: collapse; margin: 0px;}
    .tblLeft {text-align: left;}
    .tblRight {text-align: right;}
    .tabIn {margin: 0px 0px 0px 30px;}
    .cFooter {text-align: center; float: left; width: 100%}
    td#tblTotals {font-weight: bold;}
    .tblCardInfo{padding: 20px 0px 15px 0px;}
    th {white-space:nowrap;}
    td {vertical-align:top;}
    .notLast {padding: 0px 15px 0px 0px;}
    .last {padding: 0px 0px 0px 15px;}
    .transInfo {font-size:11px;padding: 2px 0px 2px 0px;}

<table class="btlTable" cellpadding ="5"> 
<tr>
<td><b>Betalingsalternativ</b></td>
<td><b>Effektiv rente</b></td>
<td><b>Rentebeløp</b></td>
<td><b>Gebyrer</b></td>
<td><b>Total kostnad</b></td>
<td><b>Månedlig betaling</b></td>
</tr>
<tr>
<td>Betaler alt ved første faktura</td>
<td>0,0%</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>15.000</td>
</tr>
<tr>
<td>3 måneder</td>
<td>11,3%</td>
<td>269</td>
<td>0</td>
<td>269</td>
<td>5.090</td>
</tr>
<tr>
<td>12 måneder</td>
<td>19,8%</td>
<td>1.517</td>
<td>0</td>
<td>1,517</td>
<td>1.376</td>
</tr>
<tr>
<td>36 måneder</td>
<td>22,3%</td>
<td>5.154</td>
<td>0</td>
<td>5.154</td>
<td>560</td>
</tr>
<tr>
<tr>
<td colspan ="5"><br>Tabellen viser ulike betalingalternativer for nedbetaling dersom du kjøper en vare for kr 15.000.</td>
</tr>
<tr>
<td colspan ="5">Beregningen forutsetter at du benytter deg av eFaktura. Nominell rente er 21,62%</td>
</tr>

</table>

I can not post pictures due to lack of reputation, but the table has a border around itself. There are however no borders between the rows and columns. Can anyone see what could be causing this? I am completely stumped. Any help is much appreciated!

Upvotes: 0

Views: 91

Answers (2)

Aru
Aru

Reputation: 1870

Just update your CSS like it is shown below.

CSS :

.btlTable, .btlTable td { border: 1px solid #A4A4A4; }

JSFiddle

Upvotes: 5

Michał Kutra
Michał Kutra

Reputation: 1202

You need to add borders to td elements inside table.

That will do the job

Here is pure jsfiddle http://jsfiddle.net/r46phvhL/3/

Upvotes: 0

Related Questions