This error comes up only for the first code, but not the second, how come?
Warning: A table row was 1 columns wide, which is less than the column count established by the first row (3).
From line 1234, column 14; to line 1235, column 11
</td>↩ </tr>↩ <
The line number given is where the error was discovered, but the error itself is in line 1265. It looks like the <td> before the one starting on line 1266 does not have a closing </td> tag.
It would really help you to see these missing tags if you indented your code properly.
It’s because you now have matching <td> and </td> tags. Have you run your code through the html validator yet to see if there are any other errors?
Your last table row only has one table cell, and the other ones have three. Each row in a table must have the same number of cells. If not, you need to add colspan = 3 to the cell in that last row to show that you want the cell to span three columns.
How do I fix this? https://jsfiddle.net/tjxqoomp/18/
Warning: A table row was 1 columns wide, which is less than the column count established by the first row (3).
From line 1234, column 14; to line 1235, column 11
</td>↩ </tr>↩</tab
I don’t think that’s an error though if I wanted the last block to drop bellow. Am I right?
IF you had an html table that contained TABULAR data (e.g. dates and temperatures, etc), and you wanted the last row to only have one cell, you would mark it up like this:
<tr>
<td colspan = 3>
Some content here
</td>
</tr>
But as yours does not contain tabular data, you should really find a different solution.
Well why don’t you spend some time to actually learn HTML and then you will know how to write the correct HTML to mark up your content. That will then make styling it much easier.
To me your content looks like a list so it should probably be marked up that way.
A table is constructed like a checkerboard matrix or a spreadsheet in that each row must have the name number of columns (cells). One cannot have a different number of cells in different rows except in an HTML table with the use of the colspan attribute. The function of the colspan attribute is to tell the table that more than 1 column is being used for one cell; so in the end, an equal number of columns per row is accounted for.
Your MUST include two more empty cells in the last row of the HTML so there will be three cells per row.
You probably do not want those empty cells to have blue borders. OK. Because you are assigning the borders by using a className, just create two empty cells <td></td> and do not give them a className.
PS: this “same number of cells per row” requirement applies to non-html tables, too, even if the validator gives it a pass.
Structural integrity is the name of the game.
BTW: I concur with @WebMachine that code is much easier for humans and cats to read if it is uniformly indented. Help us help you by making your code as readable as reasonable.
