winとmacで表示が違う

[新着] Webテンプレートを仮オープンしました



0   名前:  : 2005/06/22 17:13  [URL
HTML完全初心者です・・・。
macで作っていて、macではちゃんと表示されるのですが、winでは文字が下半分切れていたり、
スクロールするとバグったりします。
また、スクロールバーを変更するのもなんだかうまくいっていません。

自分では何がまずいのか全く分かりません。
どうか助けてください!

1   名前: phpinfo() : 2005/06/22 17:13
>macで作っていて、macではちゃんと表示されるのですが、
そのmacで使っているプラウザは?

>winでは文字が下半分切れていたり、
何処の文字ですか?

>スクロールするとバグったりします。
どういう風になるのですか?(具体的に)

2   名前:  : 2005/06/22 17:13  [URL
phpinfo()さま、返信ありがとうございます!

macではFireFoxを使ってます。ちなみにwinではIEです。
下半分が切れている文字というのは、ほとんどのページの右下に配置している"moralist walking"という文字です。
最初はもっと大きくしていたのですが、そのときは完全に下半分が切れていました。

バグるのは、文字がスクロールしても残像のようにずっと後に残って、その文字がたくさん重なって見えたりします。
あと、関係のないページの背景画像が見えたりもします。

HTMLのことをほとんど何も知らなくて、馬鹿の一つ覚えみたいにタグを打っているので、文法はかなりひどいことになってると思います・・・。
ほんとすいませんが、よろしくお願いします!

3   名前:  : 2005/06/22 17:13
HTMLやCSSの書き方は確かに酷いと思いますが、
原因はline-height:160%という指定だと思います。

<div class="titleletter">
<b><font size="6">moralist walking</font></b>
</div>

これの、line-height:160%をはみ出る分が
IEだと切れてしまうのでしょう。

titleletterの文字の大きさが100%の基準です。
それの1.6倍まで耐えますが、
size属性に6を指定したFONT要素が、限界を突破しています。

line-height:1.6にすれば、その要素の中で
フォント・サイズが違う部分があったりしても、
柔軟に計算してくれると思います。やってみそ。

4   名前:  : 2005/06/22 17:13  [URL
びさん、返信ありがとうございます。
文字の件は直りました。どうもありがとうございました!

バグの方はどうしたらよいでしょうか・・・。
これは文法がひどいせいなんですか?具体的にどのへんがまずいのか教えていただけるとありがたいです。

それから普通の文字を、背景画像と同じようにスクロールしても一定の場所に固定するにはどうしたらよいでしょうか?
質問ばかりですいません。
よろしくお願いします。

5   名前: 通りすがり : 2005/06/22 17:13
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
これはフレーム定義ファイル(<frameset>のあるページ)につけるのが正しい。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
これに変えてみたら?

あと。広告下げひどすぎるよ。
コピーライトが見えようが見えまいが、fc2webは本文の下は<br>で下げたら
いけない決まりでしょう。
大量の<br>を使わなくて済むように、修正したほうがいいですよ。

6   名前:  : 2005/06/22 17:13  [URL
通りすがりさん、返信ありがとうございます。
宣言文のところ直してみましたが、バグは変わりません。
バグが出るページはひとつだけ(Aboutのところです)なので、そのページに問題があるのかなと思います。

あと、広告下げについてですが、まだ本文ができていないので、どんな感じになるかを見るために下げているだけです。
ちゃんと修正します。アドバイスありがとうございます。

7   名前: maimu : 2005/06/22 17:13
Aboutのページ
<META HTTP-EQUIV="Content-Type"
CONTENT="text/html; charset=JIS">
しかありませんでしたので
<META http-equiv="Content-Style-Type" content="text/css">
を追加してみてはどうでしょうか?

うちの環境(winXP IE6)では、それで正しく表示されました。
(同じ状況を再現したうえで、そこからの検証)

>これは文法がひどいせいなんですか?

文法の書き方が悪いのかと思われたなら、
こちらでチェックしてみることをおすすめしておきます。
http://openlab.ring.gr.jp/k16/htmllint/htmllint.html

8   名前: 通りすがり : 2005/06/22 17:13
>あと、広告下げについてですが、まだ本文ができていないので、
>どんな感じになるかを見るために下げているだけです。
その理由でメニューページまで下げる必要あるんですか?
まあそれはともかく、スクロールするほどのページにPOSITION: absoluteでの
下部配置は止めたほうがいいと思うけど。

charset=JISはcharset=EUC-jpじゃないのかな?
メモ帳などで修正してアップしてるならshift_jisか…
"MS Pゴシック"はスペースは半角、アルファベットは全角で。
あと、 "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"
これを抜いた状態でためしてみるとか。
こちらのpcに保存すると、同じ状態が再現できんので、原因が探り出せない。
一度ページを作り直して、上書きアップロードしてみては?

9   名前:  : 2005/06/22 17:13
本筋と無関係な指摘が多くて笑った。
問題は一つずつ解決しましょうよ。

4>
スクロールするとバグったりするのは、
ブラウザの描画能力がいっぱいいっぱいなので
多めに見てやってください。
特に背景画像を固定すると負担が増えます。

スクロールバーの色は私のWinIE6だと、
使いにくい配色ですけど、変わっています。
どうしたいのかまでは、分かりません。

文字を背景画像みたいに固定するのはposition:fixedでできます。
けどWindowsのIEは未対応です。
それっぽいものを擬似的に再現することはできますが、
あまりオススメできません。
参照=>http://www5e.biglobe.ne.jp/~bill/the/css/fixed.html

8>
橘さんはiso-2022-jpでページを作っていますので
charset=iso-2022-jpが正解です。

10   名前: 通りすがり : 2005/06/22 17:13
9>
>橘さんはiso-2022-jpでページを作っていますので
>charset=iso-2022-jpが正解です。
「charset=JIS」はイコール「charset=iso-2022-jp」なのですか?
だとしたら私が無知でした。橘さん、申し訳ないです。

>本筋と無関係な指摘が多くて笑った。
「文字がぶれる」の原因が特定できない以上、見つけられる修正点を
上げただけなんですが……
web上で見るとぶれるのに、保存して見るとぶれないのはなぜなんでしょう?
「ブラウザの描画能力がいっぱいいっぱい」だから??

11   名前:  : 2005/06/22 17:13  [URL
>maimuさん
返信ありがとうございます!
アドバイスどおり、
<META http-equiv="Content-Style-Type" content="text/css">
追記してみました、が、ダメでした・・・。うちのIEでは直りませんでした。うう。
それから、教えていただいた文法チェックのページ、行ってみたいと思います。
ありがとうございました☆

>通りすがりさん
返信ありがとうございます!
Charset=Shift_JISとEUC-jp両方ためしてみましたが、文字化けしてしまいました。
それから広告のことですが、fc2webはメニューページには広告つかなくできるのですが、そのためにindexページの設定を変えなくてはいけなくて、そっちがまだできていないため、とりあえず下げて見栄えだけ見てるっていう状況です。
でも確かにあれでは広告を隔してるようにしか見えないですよね。すいませんでした。
ちゃんと直します。

あと、私はposition:absoluteが、ページの全部の長さの中での位置で固定されるのだと勘違いしていました。
最初に表示される中での絶対的な位置、ということだったんですね。
下部配置は止めた方がいいんですね・・・そうします。勉強になりました。
ありがとうございます!

>びさん
返信ありがとうございます!
スクロールバー、変わりました!どの設定がどこの色になるのか分からず適当に色をいれたら、スゴイ見にくいですね(笑)。
直しておきます。
それで、もう一つ質問させていただきたいのですが、メインフレームの方の下につく、横方向のスクロールバーは、消すことはできないのでしょうか?

バグるのは描画能力のせいなんですか・・・。
画像固定は負担大きいんですね。知りませんでした。
背景画像の画質を落としてかなり軽くしてみたりもしたんですけど、無理でした。
ただ、コピーライトの下部配置を止めると、バグも直りました。
通りすがりさんもおっしゃっていたように、position:absoluteでの文字の下部配置は止めたほうがいいみたいですね。
背景画像に直接文字を入れて、画像として文字を表示したりする方が早そうですね。
ほんとに色々とありがとうございます!

12   名前:  : 2005/06/22 17:13
フレームセルの横スクロールバーについては
http://www.airemix.com/pukiwiki/pukiwiki.php?%5B%5BIETips%5D%5D#content_1_4
が参考になると思います。好きな方法を。

一覧へ戻る