WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:(CSS)文字量に左右されず色つき背景の幅を伸ばしたい、他2点

0:[投稿] もん [URL] [2004/03/10 14:41 ][環境:IE5.5/Opera6(Win)、IE5.1/IE5.2/NN6/NN7(Mac) 不明]

はじめまして。
CSSでのレイアウト時に起こっている現象についてお尋ねします。
CSSのソースは
http://www.ne.jp/asahi/mong/chan/bgcolor/css/question.css
です。

1)
ページ上部のリンク部分と、その下のパンくずリスト部分の背景色を、白い背景の右端まで伸ばしたいのですが、うまくいきません。
divタグで囲んだリンク部分やパンくずリストのCSS定義にwidth="auto"やwidth="100%"を加えると、なぜか無視されたり、ヘッダ部分のレイアウトが崩れたりします。
リンク部分の中の文字はすべて、背景に対して中央揃え、パンくずリストの文字は左揃えのままにしたいと思っています。
ちなみに、IE5.1(Mac)では、パンくずリストのみwidth="auto"で実現しました。

2)
ページ左下、背景水色のコラム内著作権表記のボトムラインを、中央コラムのボトムラインと揃えることは(CSSで)可能でしょうか?
中央コラムの文章量は変動するので、それに連動して左コラムの位置も動かしたいのですが。。

3)
ページ右下コラムが緑のフッタ部分に被って表示されてしまいます。

以上、IE5.5/Opera6(Win)、IE5.1/IE5.2/NN6/NN7(Mac)で確認し、いずれも現象が再現します。
CSSでレイアウトするのは初めてなので、単純な間違いか設計自体のミスか…。
どうぞよろしくお願いいたします。


1:[質問] もん [URL] [2004/03/10 18:00 ]

すいません、追加でお尋ねです。
ページ上部リンク部分にポインタを乗せると、背景色が変わるようにa:hoverを設定しています。
本来は、左右の赤い縦線に挟まれたエリア全体の背景色が変わってほしいのですが、現状は文字の背景色のみが変わる状態です。
リンク部分を定義している設定にdisplay:block;を追加してみましたが、変化がないかレイアウトが崩れるかのどちらかです。
CSSの定義に問題があるような気がするのですが、どこを直せばよいのかわかりません。
どなたかご教示くださいませ。
よろしくお願いいたします。


2:[回答] 平野 敬 [MAIL] [URL] [2004/03/11 18:54 ]

まず,問題を切り分けて単純化することをお奨めします。回答者も人間ですから,複合的な問題を解析してまで答えようという気はなかなか起きません。

とりあえず,ボックスモデルを再検討してみてください。
http://www.swlab.csce.kyushu-u.ac.jp/man/rec-css2/box.html
http://hp.vector.co.jp/authors/VA022006/css/box.html


3:[完了] もん [URL] [2004/03/12 13:02 ]

平野 さま

いただいたアドバイスの通り、問題を切り分けて検討している最中です。
まだ解決はしていませんが、単純にCSSの知識が足りないことと、十分に設計する前にレイアウト組みを始めてしまったことが大きな原因のようです。

限界に達したら、改めてスレッドを立てて質問させていただきます。
ご返答ありがとうございました。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World