• ベストアンサー

%(パーセント)での3カラム構成・・・飛び出ます。

現在、画面いっぱいに表示させる為のページを%で指定してcssにて作っております。 とても単純な様に安易に考えていたのですが旨く表示できません。 まず、左、中央、右のボックスを作りました。指定した幅は、25%、50%、25%となっていますが、一番右のボックスだけが飛び出してしまいます!! 初めて%で作ったのですが、100%になっては駄目なのでしょうか?? 出来れば中央のボックス左右に少しだけマージンが欲しいですが、全てフロートがかかっているため、均等に余白も作れません。(真ん中がどちらかに寄ります。) %で作るときの基本などがあればアドバイスいただけたらと思います。 どうぞ、宜しくお願いいたします。

質問者が選んだベストアンサー

  • ベストアンサー
noname#20964
noname#20964
回答No.2

25%、50%、25%ってwidthの値ですよね。 widthは内容の幅ですからmarginやpaddingの分だけ全体が広がってしまうと思います。 __________________________________ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML> <HEAD> <TITLE>copy</TITLE> <style type="text/css"> #left,#rigth{width:25%;border:solid 1px;} #left{float:left;} #rigth{float:right;} #center{margin-left:25%;margin-right:25%;border:solid 1px;padding:15px;} </style> </HEAD> <BODY> <div id="left">左</div> <div id="rigth">右</div> <div id="center">中</div> </BODY> <HTML> 真中の幅を指定せずに両脇の余白を左右のボックス幅にして真中に回り込ませたら如何でしょうか。

momonga_Q
質問者

お礼

遅くなり申し訳御座いませんでした。 皆様のアドバイスで無事解決いたしました。

その他の回答 (1)

回答No.1

合計値をきっちり100%に指定すると、指定した%値をその画面に合わせたピクセルの値に変換する際に、端数が生じてカラム落ちする事があります。 この為、100%ではなく97%など、若干小さめに作る方が良いようです。

関連するQ&A