cssでレイアウトしようとしいているのですが、うまくいきません。 ads エリアがコンテナの右側に来て欲しいのですが、IEでは単に右に行くだけになっています。 よろしくお願いします(__)


〜省略〜
<style type=”text/css”>
<!--
div
{
margin: 0px;
padding: 0px;
}
#container {
float: left;
width: 800px;
}
#fa {
float: right;
height: auto;
width: 160px;
}
#fotter {
clear: both;
}
#main {
float: right;
width: 600px;
}
#side {
float: left;
width: 200px;
}
body {
margin: 0px;
padding: 0px;
width: 960px;
}
-->
</style>
</head>
<body>
<div id =”container”>こんてなはじめ<div id=”header”>へっだー </div><div id=”main”>めいん</div><div id=”side”>さいど</div>こんてなおわり</div>
<div id=”fa”>ads エリア</div><div id=”fotter”>ふったー</div>
</body>
</html>

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2005/07/20 07:20:39
  • 終了:--

回答(3件)

id:stnet No.1

stnet回答回数804ベストアンサー獲得回数342005/07/20 07:43:38

ポイント30pt

http://www.stupid-net.com/x/mt/archives/000188.shtml

表示の崩れない3段カラム [ MSM-03C ]

―ヘッダー――|ads

さいど|メイン|

――フッター―――

って配置で良いんですかね?


bodyタグにwidthを指定してもダメです.

あと回り込む要素を前に書かないと回り込んでくれないですね


<style type=”text/css”>

<!--

div

{

margin: 0px;

padding: 0px;

}

#container {

float: left;

width: 800px;

}

#fa {

float: right;

height: auto;

width: 160px;

}

#fotter {

clear: both;

}

#main {

float: right;

width: 600px;

}

#side {

float: left;

width: 200px;

}

#body {

margin: 0px;

padding: 0px;

width: 960px;

}

-->

</style>

</head>

<body>

<div id=”body”>

<div id=”fa”>ads エリア</div>


<div id =”container”>

<div id=”header”>へっだー </div>

<div id=”main”>めいん</div>

<div id=”side”>さいど</div>

</div>

<div id=”fotter”>ふったー</div>


</div></body>

</html>

id:kidd_pclabo

おお、ちゃんとなりました。

できれば、adsは重要度からいって、後ろの方がいいのですが、そうする方法はありませんか?

参照URLでわかりました。ありがとうございました!

2005/07/20 18:54:28
id:apo-gee No.2

apo-gee回答回数8ベストアンサー獲得回数02005/07/20 08:56:22

ポイント15pt

http://www.tohoho-web.com/css/

とほほのスタイルシート入門

body width: 960px

#container width: 800px

#fa width: 160px

ということですので、

body の中に#containerと#faが入り、

#containerの右側に#faが回り込むようにするということですね。

floatは、指定したdivブロックをleftまたはrightに配置して後ろに続く要素をその反対に回り込ませますので、#fa要素はfloat: left;またはnone;ではないでしょうか。

id:loph No.3

ggg回答回数29ベストアンサー獲得回数02005/07/20 11:32:48

ポイント15pt

CSSを下記に差し替えでいかがでしょうか?


<style type=”text/css”>

<!--

div

{

margin: 0px;

padding: 0px;

}

#container {

float: left;

width: 800px;

}

#fa {

float: left;

height: auto;

width: 160px;

}

#fotter {

clear: both;

}

#main {

float: right;

width: 600px;

}

#side {

float: left;

width: 200px;

}

body {

margin: 0px;

padding: 0px;

width: 960px;

}

-->

</style>

id:kidd_pclabo

おお、ちゃんとなりました。

できれば、adsは重要度からいって、後ろの方がいいのですが、そうする方法はありませんか?

参照URLでわかりました。ありがとうございました!

2005/07/20 18:53:50
  • id:stnet
    adsの位置

    ゴメンなさい.
    ads後ろでも大丈夫ですね.

    <div id=”body”>
    <div id =”container”>
    <div id=”header”>へっだー </div>
    <div id=”main”>めいん</div>
    <div id=”side”>さいど</div>
    </div>
    <div id=”fa”>ads エリア</div>
    <div id=”fotter”>ふったー</div>
    </div>
    </body>

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません