html - PHP/HTML での情報の配置

Question

現在、次のような情報を表示するこのコードがあります。

 <?php
    mysql_connect("localhost","example","password") or die("Could not connect to localhost");
mysql_select_db("exampledb") or die( "Could not connect to database");
$result = mysql_query("SELECT * FROM tablexample");

echo "<b>" . "Name"  . "</b>" . "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" . "<b>" . "Number" . "</b>";
echo "<br/>";
echo "<br/>";
while ($row = mysql_fetch_array($result))
  {
echo  ucwords($row['name']) . "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" . ucwords($row['number']) . "<br>"; 
echo "<hr width='20%'>";
  }
?>


Name              Number

B              (888) 888-3545
C         (098) 545-4354
Cl               (888) 888-3545
Da              (888) 888-3545
H               (888) 888-3545
H               (888) 888-3545
Khzdf              (888) 888-3545

しかし、私はそれらをこのように整列させたいです（各名前の文字数をオーバーライドし、同じスペースを持つ必要があります：

Name              Number

B              (888) 888-3545
C              (098) 545-4354
Cl             (888) 888-3545
Da             (888) 888-3545
H              (888) 888-3545
H              (888) 888-3545
Khzdf          (888) 888-3545

-- これは CSS または PHP で行われますか?

Answer 1

テーブルの使用を考えたことはありますか？テーブルは素晴らしいです....構造化データを表示するのに

<table>
    <thead>
        <tr>
            <th>Column1</th>
            <th>column</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Column1 data</td><td>column 2 data</td>
        </tr>
    </tbody>
</table>

Answer 2

これはCSSまたはPHPで行われますか?

ない！HTML<table>はあなたが探しているものです..それらは意味論的にも適切です。

Answer 3

問題を解決する最も速い方法はこれでしょう。

コードでこれを変更できます：

echo  ucwords($row['name']) . "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" . ucwords($row['number']) . "<br>";

これに：

echo  "<span style='display:inline-block; width:200px; text-align:left;'>" . ucwords($row['name']) . "</span><span style='display:inline-block; text-align:left;'>" . ucwords($row['number']) . "</span><br>";

注：200px必要に応じて変更してください。