Как получить две таблицы, выровненные рядом друг с другом как в верхней части страницы.

Question

Я ищу, чтобы эти две коробки были выровнены рядом друг с другом бок о бок, но все, что я продолжаю генерировать, - это два блока с одним, центрированным на странице и очень мала, а другая коробка сжимается при вводе текста в нее. Таблицы расположены в разделе php на странице.

echo "<table style='width:100%;'><tr><td>"; 
echo "<div style='min-height:500px;margin-top: 10px;'><table style='-moz-border-radius: 15px;border-radius: 15px;border-bottom:1px solid gray;align: left;float: left;background- color:white;margin: auto;width: 75%;'><tr style='font-weight:bold;'><td></td><td>Title</td> <td>Date</td><td>City</td></tr>"; 
//header('Content-type: text/html; charset=utf-8'); 
//print_r(mysql_fetch_array($result)); 
while($row = mysql_fetch_array($result)) 
{ 
$abcd = $row['fname']; 
echo "<tr><td><img src='../login/image/".$row['name']."' style='width: 125px;height: 94px;'></td>"; 
echo '<td><form action="deals.php" method="get" style="margin:0px;"><input type="hidden" value="'; 
echo $abcd; 
echo '" name="name"><input type="submit" style="background-color: white;border: none;color: #FF0000;text-decoration: underline;" name="submit2" value="'; 
echo $abcd; 
echo '"></form><br/>'; 
echo "</td><td>".$row['stdate']."</td>"; 
echo "</td><td>".$row['city']."</td></tr>"; 
$y++; 
} 
echo "</table></div>"; 
echo "</td><td>"; 
echo "<div style='-moz-border-radius: 15px;border-radius: 15px;height:10%;width: 50%;padding: 30px;background-color:white;align: right;float: right;margin: auto;margin-top:5px;'>"; 
echo "</td></table>"; 

Answer 1

Лучше отделить свой CSS и PHP Script, чтобы было легче видеть ваши свойства CSS. Попробуйте добавить переменную вместо добавления эха каждый раз. Вы писали: «выровнять« вместо «text-align» для вашего стиля, вероятно.

$string = "<table style='width:100%;'><tr><td>"; 
$string .= "<div class="my-style"><table>"; 
$string .= "..."; 

Затем в файле CSS:

.my-style { 
min-height:500px; 
margin-top: 10px; 
} 

.my-style table { 
-moz-border-radius:15px; 
border-radius: 15px; 
border-bottom:1px solid gray; 
text-align: left; 
float: left; 
background- color:white; 
margin: auto;width: 75%; 
} 

UPDATE

Если вы хотите две таблицы бок о бок:

.table1 { 
    width:auto; 
    max-width:49%; 
    display:block; 
    float:left; 
} 
.table2 { 
    width:auto; 
    max-width:49%; 
    display:block; 
    float:right; 
}