ARTICLE AD BOX
I would like to have two tables next to each other and 1 table under the tables, but it shows up next to the other two.
<style>
.divtag {
table { float: left; }
}
</style>
<div class="divtag">
<table>
<tr>
<td> 1 </td>
</tr>
</table>
<table>
<tr>
<td> 2 </td>
</tr>
</table>
</div>
<table>
<tr>
<td> 3 </td>
</tr>
</table>
7,6268 gold badges73 silver badges100 bronze badges
New contributor
Bart is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct.
5
To start with, it looks like you use wrong CSS syntax. Did you mean something like .divtag table { float: left; } or .divtag > table { float: left; }? If you did that, it would be a selector for 2 first tables, but not for the last one.
2026-03-20 06:08:54 +00:00
Commented 1 hour ago
Also, it's always a good idea to rework your code sample into a code snippet. Please see the menu item snippet on top of the post editor menu. This way, we would be able to run your Web application sample right on this page and play with the code. Accepted files are HTML + CSS + JavaScript. Please see this article.
2026-03-20 06:12:28 +00:00
Commented 1 hour ago
Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking.
2026-03-20 07:12:57 +00:00
Commented 47 mins ago
"but it shows up next to the other two" - yes, because those first two are floated. "Floated" actually means, other content is allowed to float around (or in this case, next to) the element that you actually applied float to. You need to clear the float to make the following content go underneath. developer.mozilla.org/en-US/docs/Learn_web_development/Core/…
2026-03-20 07:50:39 +00:00
Commented 9 mins ago