4

私は3つ持っていますdivs：

<div id="login" />
<div id="content" />  
<div id="menu" />

CSSスタイルを（HTMLに触れずに）定義してmenu-div、 を左の列に、login-divを右の列にcontent-div、 を右の列に、しかしlogin-div.

すべてのwidthdiv は固定されていますが、heightそうではありません。

4

2 に答える 2

6 
#menu {
  position:absolute;
  top:0;
  left:0;
  width:100px;
}
#content, #login {
  margin-left:120px;
}

なぜこのように？マークアップの最後に来るメニューはそれを難し​​くします。コンテンツとログイン権の両方をフロートさせ、コンテンツにclear：rightを追加することもできるかもしれませんが、これが最善の策かもしれません。全体像を見ずに、あなたのケースで間違いなく機能するソリューションを提供することは困難です。

編集：これもうまくいくようです：

#content, #login {
  float:right;
  clear:right
}

その他の考え：列を中央に配置したい場合、絶対配置は機能しません（またはうまく機能しません）。フロートは機能しているようです-フロートソリューションでパンアウトするための列間の境界タイプの要件を取得できる限り、それを選択した方がよい場合があります。繰り返しになりますが、サイトを左揃えにする場合は、絶対的な方法がニーズに非常に適していると思います。

于 2008-09-25T15:54:05.773 に答える
0

浮かんで...完璧ではありません。 クリスの答えはより良い解決策のようです。

#login {
  float: right;
  width: 400px;
  border: 1px solid #f00;
}

#content {
  clear: right;
  float: right;
  width: 400px;
  border: 1px solid #f00;
}

#menu {
  float: left;
  width: 400px;
  border: 1px solid #f00;
}
<div id="login">Login</div>
<div id="content">Content</div>
<div id="menu">Menu</div>

于 2008-09-25T15:57:19.620 に答える