0

問題：

を使用して div を隣り合わせに配置しようとしてfloat:leftいますが、動作させることができません。代わりに、それらは互いに整列しています。

PHP コード:

while ($row = mysql_fetch_assoc($result))
{
    $kriterium .= '<div style="float:left;">'.$i.'</div>';
    $betyg .= '<div style="float:left;">'.$row['RID'].'</div>';

    $mean += $row['RID'];

    $i++;
}

$meanvalue = round ($mean / ($i-1), 2);

$kriterium .= '<div style="float:left;"><b>Medelv&auml;rde</b></div>';
$betyg .= '<div style="float:left;"><b>'.$meanvalue.'</b></div>';

$html .= '
    <div class="table table-condensed table-bordered neutralize">
        <div>
            <b>Kriterium</b>'.$kriterium.'
        </div>
        <div>
            <b>Betyg</b>'.$betyg.'
        </div>
    </div>';

望ましい出力:

ここに画像の説明を入力

質問：

div が互いに隣り合う列のように配置されるように変更する必要がある CSS コードの何が問題になっていますか?

4

2 に答える 2

2

divごとに幅を設定する必要があります。最初の div の幅は、他の div の幅よりも広くなります。

<!DOCTYPE html>
<html>
  <head>
    <title>Kexx</title>
    <style type='text/css'>
    div.table-bordered > div  {
      width:420px;
    }
    div.table-bordered > div > div.c {
      width:94px;
    }
    div.table-bordered > div > div {
      float:left;
      width:24px;
    }
    div.table-bordered div {
      border:1px solid #333;
    }
    </style>
  </head>
  <body>
    <div class="table table-condensed table-bordered neutralize">
      <div>
        <div class='c'><b>Kriterium</b></div>
        <div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
        <br style='clear:both;'/>
      </div>

      <div>
        <div class='c'> <b>Betyg</b></div>
        <div>A</div>
        <div>B</div>
        <div>C</div>
        <div>D</div>
        <br style='clear:both;'/>
      </div>
    </div>

  </body>
</html>

http://jsfiddle.net/Zv7Dp/

于 2012-06-15T09:17:30.590 に答える
0

ところで、別のスタイル シートがある場合は、クラスを定義し、すべてのスタイルを 1 つのクラスの下に置くことができます。これよりも html テーブルを好む方法で、css テーブル スタイルと同じ数を見つけることができます。グーグルで！

于 2012-06-15T09:13:00.523 に答える