2

それで上司は私にこう言います。私は年をとっていて混乱しやすいですが、テーブルの使用をやめて、神が意図したように css を使用する時が来たと考えました。

<div id="hdr">
<i>Call us today</i> &nbsp;&nbsp; CorpHQ - nnn.nnn.nnnn &nbsp;&nbsp;
<i>Sign up for our newsletter:</i>&nbsp;&nbsp;
<form action="signup.php" method="post">
<input name="email" type="text">
<input name="submit" type="submit" value="SUBMIT">
</form>
</div>

しかし、垂直方向に並べようとしても、Chrome、IE6、IE7、Firefox のいずれでサイトを表示するかによって、さまざまな不可解な結果が得られます。（主に、フィールドと送信ボタンのサイズと垂直方向のセンタリングについて話しています。）

1) 私が知らない大きな秘密はここにありますか?

2) テーブルを使用するために元の計画に戻る必要がありますか?

3) CSS は実際には、宇宙人が「To Serve Man」のコピーを印刷している間、私たちを夢中にさせるために発明した残酷なトリックですか?

ハーフ！

4

2 に答える 2

2
  1. いいえ
  2. いいえ
  3. いいえ

各項目を独自の div に配置し、それらすべての div を親 div に配置します。

<div class="wrapper">
  <div class="contact"></div>
  <div class="signup_form"></div>
</div>

これで、親の div (ラッパー) を必要に応じて配置できます。ラッパー内に含まれる各要素は、ラッパーの配置から開始されます (その後、必要に応じて各要素を変更できます)。

.wrapper {
  width: 800px;
  margin: 0px auto; /* centered */
}

.contact {
  height: 200px;
  margin-left: 80px; /* will be 80 pixels off of the center */
  float: left; /* placed to the left */
}

.signup_form {
  float: right;
}

これで、連絡先とサインアップ フォームが同じ行に表示されます。

于 2010-05-24T17:25:05.097 に答える
0 
<div id="hdr">
<form action="signup.php" method="post">
<i>Call us today</i> &nbsp;&nbsp; CorpHQ - nnn.nnn.nnnn &nbsp;&nbsp;
<i>Sign up for our newsletter:</i>&nbsp;&nbsp;

<input name="email" type="text">
<input name="submit" type="submit" value="SUBMIT">
</form>
</div>

フォームがブロックとして表示されます。したがって、次の行に「ジャンプ」します。これは簡単な+汚い修正にすぎません。ラベルを使用する必要があり<i>ます&nbsp;。ああ、また、癖モードになっていないことを確認してください。

于 2010-05-24T17:25:44.050 に答える