Placing Tables In CSS Side By Side

HTML & CSS
1

We need to see the code that you’re using, or a link to your page, to help you work out where the proble, lies.

2

As TechnoBear said we’d need to see the whole structure but usually you can float tables side by side if needed (and assuming there is room).

3

… and assuming they should even be tables in the first place…

4

and who decides whether they should be tables or not? :lol:. Certainly not you, I or anyone else :wink:

Although I wouldn’t recommend using tables for layout, if someone wants to choose to use tables for layout no-one has the clout to enforce they don’t :), especially if the html passes the w3c validator.

@op

You can float and style tables just like any element. Post your code so we can see what is happening.

5

A very basic starting point would be


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Experiment</title>
<style media="all">
table {border: 1px solid #000; border-collapse: collapse; float: left;}
</style>
</head>

<body>
	<table>
	<tr>
	<td>Name of user1 here</td>
	<td>salary of user1 here</td>
	</tr>
	</table>

	<table>
	<tr>
	<td>Name of user2 here</td>
	<td>salary of user2 here</td>
	</tr>
	</table>
</body>

</html>
6

and if you wanted to left and right justify the tables, you can float: left one table and float:right the other table.

7

I would question these being tables, since tables are data that fits into rows AND columns – you seem to be using multiple tables to do multiple lists… possibly a set of nested lists from a semantic standpoint.

If it WERE to be a table (assuming there’s enough data to warrant it) I would at the very least make the name field be a TH, so there’s a topic for each row. It also comes down to how many of these are you putting on every page, since you could have float drop and float ride-up issues if they aren’t all the same height with the same information.