Форум Сайтостроение Веб-строительство

Как 2 таблицы поставить рядом? css

P
На сайте с 06.01.2009
Offline
601
postavkin
1085

Здравствуйте.

Прошу помочь.

Что нужно непосредственно в код страницы дописать, чтобы 2 таблицы ставились рядом,

т.е. выводим 2 таблицы, перенос строки, выводим ещё 2 таблицы, перенос строки и т.д.

Спасибо

код 


<table border="1" width="300" bordercolorlight="#000000" bordercolordark="#000000" id="table1">

	<tr>

		<td>&nbsp;<p>&nbsp;</p>

		<p>&nbsp;</td>

	</tr>

</table>





<table border="1" width="300" bordercolorlight="#000000" bordercolordark="#000000" id="table2">

	<tr>

		<td>&nbsp;<p>&nbsp;</p>

		<p>&nbsp;</td>

	</tr>

</table>





<table border="1" width="300" bordercolorlight="#000000" bordercolordark="#000000" id="table3">

	<tr>

		<td>&nbsp;<p>&nbsp;</p>

		<p>&nbsp;</td>

	</tr>

</table>



<table border="1" width="300" bordercolorlight="#000000" bordercolordark="#000000" id="table4">

	<tr>

		<td>&nbsp;<p>&nbsp;</p>

		<p>&nbsp;</td>

	</tr>

</table>



и т.д.
jpg 141045.jpg
dimsog
На сайте с 08.08.2011
Offline
149
dimsog
#1

По простому вот так🍿 

<style>

	.wrapper {

		width:500px;

	}

	table {

		float:left;

		width:200px;

	}

</style>



<div class="wrapper">

<table border="1" width="300" bordercolorlight="#000000" bordercolordark="#000000" id="table1">

	<tr>

		<td>&nbsp;<p>&nbsp;</p>

		<p>&nbsp;</td>

	</tr>

</table>





<table border="1" width="300" bordercolorlight="#000000" bordercolordark="#000000" id="table2">

	<tr>

		<td>&nbsp;<p>&nbsp;</p>

		<p>&nbsp;</td>

	</tr>

</table>





<table border="1" width="300" bordercolorlight="#000000" bordercolordark="#000000" id="table3">

	<tr>

		<td>&nbsp;<p>&nbsp;</p>

		<p>&nbsp;</td>

	</tr>

</table>



<table border="1" width="300" bordercolorlight="#000000" bordercolordark="#000000" id="table4">

	<tr>

		<td>&nbsp;<p>&nbsp;</p>

		<p>&nbsp;</td>

	</tr>

</table>

</div>

Отступы проставите сами?

ihor vps -> ihc.ru
VoV@
На сайте с 22.09.2007
Offline
196
VoV@
#2

Как-то так, наверное:


<style>
.row{width:100%;margin-bottom:20px;padding:0}
.col{width:50%;margin:0;padding:0;float:left}
table{width:100%}
</style>

<div class="row">
<div class="col">
<table border="1" bordercolorlight="#000000" bordercolordark="#000000" id="table1">
<tr>
<td>&nbsp;<p>&nbsp;</p>
<p>&nbsp;</td>
</tr>
</table>
</div>

<div class="col">
<table border="1" bordercolorlight="#000000" bordercolordark="#000000" id="table2">
<tr>
<td>&nbsp;<p>&nbsp;</p>
<p>&nbsp;</td>
</tr>
</table>
</div>

<div class="row">
<div class="col">
<table border="1" bordercolorlight="#000000" bordercolordark="#000000" id="table3">
<tr>
<td>&nbsp;<p>&nbsp;</p>
<p>&nbsp;</td>
</tr>
</table>
</div>

<table border="1" bordercolorlight="#000000" bordercolordark="#000000" id="table4">
<tr>
<td>&nbsp;<p>&nbsp;</p>
<p>&nbsp;</td>
</tr>
</table>
</div>
⭐ Разработка Андроид-приложений (Xamarin C#). ⭐ Разработка ASP.NET (WebForms, MVC, WebAPI, Core). ⭐ Цой жив!
Ragnarok
На сайте с 25.06.2010
Offline
239
Ragnarok
#3

или как-то так, css:


table{
float:left;
width:300px;
margin-right:30px;
}
//TODO: перестать откладывать на потом
dimsog
На сайте с 08.08.2011
Offline
149
dimsog
#4

Ничем не отличается от моего варианта :)

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий