Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Skip <td> in HTML table

Say I have the following table:

<table>
  <tr>
    <td>Example</td>
    </td>One</td>
  </tr>
  <tr>
    <td>Example</td>
    </td>Two</td>
  </tr>
  <tr>
    <td>Example</td>
    </td>Three</td>
  </tr>
  <tr>
    <!--
    Here I want to skip the first <td> cell; use only second. Example:
    <td>(empty, possibly &nbsp;)</td>
    <td>blah blah blah</td>
    -->
  </tr>
</table>

If you read my comment in the last row, you can see that in the last row I want to display something in the second column of the table, with the first remaining empty. How would I go about doing this?

As a side note, I read the question/answers in this SO question but colspan is different from what I want. I'm also not familiar with css empty-cell so if that is a solution, please provide a bit of sample code.

like image 239
apparatix Avatar asked Jul 24 '12 23:07

apparatix


People also ask

How do you skip a cell in HTML?

Or, alternatively, you can insert &nbsp; in the <td> .

How do you skip a row in HTML?

To add a line break to your HTML code, you use the <br> tag. The <br> tag does not have an end tag. You can also add additional lines between paragraphs by using the <br> tags. Each <br> tag you enter creates another blank line.

How do you break a line in a table in HTML?

Place the line break code <BR> within the text at the point(s) you want the line to break. Notice in the examples below that the line break code can be used in data cells as well as in headers.

What is TD in table HTML?

<td>: The Table Data Cell element. The <td> HTML element defines a cell of a table that contains data.


3 Answers

HTML

<tr>
   <td></td>
   <td>content here</td>
</tr>

CSS

table { empty-cells: show;}

Leave the <td> empty, no reason to put a space in there. &nbsp; can act a bit funny at times, especially in tables.

like image 126
jzacharia Avatar answered Sep 22 '22 07:09

jzacharia


I can't see any reason not to do exactly what you are proposing: Use an empty cell containing only a &nbsp; ("No Break Space") in it:

<tr>
    <td>&nbsp;</td>
    <td>Whatever</td>
</tr>
like image 44
Kjartan Avatar answered Sep 18 '22 07:09

Kjartan


CSS code:

table { empty-cells: show; }

Or, alternatively, you can insert &nbsp; in the <td>.

like image 41
elo Avatar answered Sep 22 '22 07:09

elo