ttp://coliss.com/articles/build-websites/operation/css/558.html
ここの方法に習って
ttp://kotekote.web.fc2.com/test_a.html
ttp://kotekote.web.fc2.com/test_b.html
を作成しました。
test_a.htmlはindex.htmlとなるもので、1ページだけレイアウトが異なるのですが、これだけ上手く表示できません…。
CSSファイルは以下です。
ttp://kotekote.web.fc2.com/css/base.css
WindowsXPで確認したところFirefox2.0やIE7では表示されており、IE6だけ表示が上手くいかないようです。
ご助力お願いいたします…。
No.1
3
1
50pt
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
これを消してみてはいかがでしょうか？
理由は
http://128bit.blog41.fc2.com/blog-entry-117.html
に詳しいです。
幸いなことにfc2ブログをご使用のようですので。
No.1
31
ここでベストアンサー
50pt
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
これを消してみてはいかがでしょうか？
理由は
http://128bit.blog41.fc2.com/blog-entry-117.html
に詳しいです。
幸いなことにfc2ブログをご使用のようですので。
ご回答ありがとうございます。
ただ、今アップしてるのは仮の環境で、実際には公な機関での使用になりますので、宣言文はなるべく省かず、ハックなどで処理できれば･･･と考えています。
現在分かっていることなのですが、
#master(width:960px)内に
#bg_l(左グラデ,width:30px),#main(ログイン部分,width:900px),#bg_r(右グラデ,width:30px)があり、
例えば#mainにborder:1px solid redのように指定して、合計のpxが#masterのwidth:960pxを越えるようになると、
表示されるようになります。(ただし、#masterから溢れた#bg_rは下にずれますが…)
他のページ(例：test_b.html)のような構造の場合は、このようなことはなく何もしなくても見えます。
ログインだけ階層が複雑になりすぎているからでしょうか…。
No.2
46069
35pt
> ログインだけ階層が複雑になりすぎているからでしょうか…。
そうではなくて、log-in ページには画像があるからでしょう。
画像の周りに自動的にマージン、パディング、ボーダーが入ったりって事は無いでしょうか？
ボックスサイズを計算してキッチリ合わせようとすると、ほとんどの場合 IE6 は失敗しますねぇ...
チョッとだけ試してみましたが、
どちらかでとりあえず表示は出来るみたい。
bg_l, main, bg_r の下側マージンとパディングを止めると main 部分は表示できるけどグラデーションが短くなっちゃいます...
単に両サイドにグラデーションを入れたいだけなんでしょうけど、３カラムにしないと出来ないモンでしょうか？
両サイドに空白文字を入れている時点で「見栄え」を排除しているとは言い難いと思うので、素直にテーブルでレイアウトしてしまったらどうでしょう？（簡単に希望通りになるのか試していないけど）
他にも方法がありそうですけど。
IE6 のときの表示の乱れを気にされていますが、スタイルシートで IE6 非対応の部分が一杯あるように思いますが大丈夫でしょうか？
「あああ」「いいい」「ううう」「えええ」「おおお」へのリンク部はマウスオーバーで真っ白になっちゃいます。
ご指摘ありがとうございます。
背景になっている画像の周りにmarginの指定がしてありました。
>単に両サイドにグラデーションを入れたいだけなんでしょうけど、３カラムにしないと出来ないモンでしょうか？
そうですね…ほかの方のコメントにもあったサイトを参照しながら構築しなおしてみます。
納期が近かったので、出来ればあまり手直しせず少し直してできれば良いな…という甘い考えがあったので、色々と見えなくなっていたものがあるようです。
気持ちを切り替えて無理のないコーディングを心がけてみたいと思います。
>「あああ」「いいい」「ううう」「えええ」「おおお」へのリンク部はマウスオーバーで真っ白になっちゃいます。
これは…確認時気づきませんでした…。
当方IE6.02のXPSP2ですが、マウスオーバー時は黄色文字で表示されています。
お手数ですが環境を教えていただいてもよろしいでしょうか？
Hi32
2008/05/30 00:52:32
6
6
LASA
tezcello
1
1
2
ご回答ありがとうございます。
ただ、今アップしてるのは仮の環境で、実際には公な機関での使用になりますので、宣言文はなるべく省かず、ハックなどで処理できれば･･･と考えています。
現在分かっていることなのですが、
#master(width:960px)内に
#bg_l(左グラデ,width:30px),#main(ログイン部分,width:900px),#bg_r(右グラデ,width:30px)があり、
例えば#mainにborder:1px solid redのように指定して、合計のpxが#masterのwidth:960pxを越えるようになると、
表示されるようになります。(ただし、#masterから溢れた#bg_rは下にずれますが…)
他のページ(例：test_b.html)のような構造の場合は、このようなことはなく何もしなくても見えます。
ログインだけ階層が複雑になりすぎているからでしょうか…。