Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add border on table cells, but not the whole table on html?

I'm trying to add a border on table cells but I cannot figure out how to do it with rowspan.

I want a table that has 4 cells 1 big cell on the left and 3 small cells on the right of the big one.

Here's the code I used

jsfiddle[dot]net/1fv4dz5g/3/

like image 319
Foxseiz Avatar asked Oct 11 '16 01:10

Foxseiz


People also ask

How do you add a border to a cell in HTML?

To create table border in HTML, the border attribute was used. But the introduction of HTML5, deprecated the border tag. Create table border using the CSS property border. Set table border as well as border for <th> and <td>.

Can we apply border to a cell in a table?

For HTML tables, you can use the border attribute to suggest the width of a border around the table and each cell. There are other methods defined in HTML 4 to suggest cell borders (or "rules", as they are called there) as separate from the overall border for the entire table.

How do you control the space between table and cell borders?

The space between the table cells is controlled by the CELLSPACING attribute in the TABLE tag. By setting CELLSPACING to zero, you can remove all the space between the cells of your table. This removes all the space between the cells of our table (see Figure 9).


1 Answers

This can be done using CSS. Check this css sample

td {
  border: 1px solid black;
}
<table class="tnews-side" border="0">

<tr>
<td rowspan="3">
<table border="1" cellpadding="4" cellspacing ="0">Row 1 Cell 1</table>
</td>
  <td>Row 1 Cell 2</td>
</tr>
<tr>
  <td>Row 2 Cell 2</td>
</tr>
<tr>
  <td>Row 2 Cell 2</td>
</tr>
</table>
like image 71
Cristian Penarrieta Avatar answered Oct 05 '22 14:10

Cristian Penarrieta