I'm adding some CSS styles to a HTML code I haven't written, and there are some contents that are inside table td's in different rows, but I need all the td's to be in the same line.
Basically, I need something like...
+-------+
| a | b |
+---+---+
| c | d |
+-------+
... to look like...
+---------------+
| a | b | c | d |
+---------------+
If you have a smaple table which looks like this:
<table>
<tr>
<th>TH1</th>
<th>TH2</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
</tr>
</table>
Then the resultant will be like:
| TH1 | Th2 |
|---|---|
| 1 | 2 |
| 3 | 4 |
But you want something which is in different 'tr' to be in one line makes it messy. You will be getting something like this if you try to do it with css
tr {display : inline;}
| TH1 | TH2 |
| 1 | 2 | 3 | 4 |
And this looks really messy better use Grid for such cases!