フレーム内の横スクロールが表示されてしまいます。

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



0   名前: 008 : 2006/01/29 19:19  [URL
タグ打ち初心者です。よろしくお願いいたします。

参照URLのページなのですが、どうしても横スクロールが表示されてしまい
ます。上部フレームのみの表示だと大丈夫です。

原因がまったくわからず困っていますどうぞよろしくお願いします。

1   名前: S : 2006/01/29 19:19
 フレーム内で呼び出している文書に使用している要素のどこかにWIDTH属性やHEiGHT属性が使用されているからでは。
 そのほかにもさまざまな問題があるのでフレームはお奨めしかねる。

http://car.s35.xrea.com/better/frame.php

#前回の書き方はちょっと不明瞭だったので訂正。

2   名前: a : 2006/01/29 19:19
根本的な解決にはならないかもしれないけど、上フレームのDOCTYPE宣言を
URLを省いたものにすると横スクロールは消えましたよ。


3   名前: 元帥 : 2006/01/29 19:19  [URL
008さん、こんばんは。
タグ打ち、頑張っておられるようですね。

下記URLを参考にされてはいかがでしょうか。
http://www.airemix.com/pukiwiki/pukiwiki.php?IETips#content_1_4
http://www.cubdesign.com/blog/archives/web/

4   名前: 008 : 2006/01/29 19:19  [URL
aさん、元帥さん。お返事ありがとうございます。

DOCTYPE宣言を

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

に変更してみました。横スクロールは消えました。
しかし、ページ内の表示が少し変になっていました。
設定の調整が必要なのかなと思いました。がんばってみます。

元帥さん、おひさしぶりです。最近サイト作りを再開しました。タグ打ちで
一から作っています。リンク先まだ読んでいませんがよく読んでみます。

タグ打ち面白いですが、一筋縄では行かないようで、中々うまく行きません。
細かい質問を今後もすると思いますがどうぞよろしくお願いします。

5   名前: 匿名希望 : 2006/01/29 19:19
>DOCTYPE宣言を<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">に変更してみました。横スクロールは消えました。
互換モードになった(レイアウトが変化したのはその為)だけでaさん自身も仰ってますが根本的な解決になっていない上にお勧めしかねます。

>aさん、元帥さん。お返事ありがとうございます。
Sさんもwidth属性やheight属性に寄る可能性を示唆して下さってるのに礼のひとつも無いのはどういう了見でしょうか?

6   名前: 008 : 2006/01/29 19:19  [URL
匿名希望さんお返事ありがとうございます。
sさんへのお返事がなく、気分を害されたのでしたら申し訳ありません。

お返事記入時、aさんと元帥さんの記事のみを見て書いていたのでうっかり
sさんへのお返事を書き忘れてしまいました。

sさん、お返事ありがとうございました。

7   名前: 通りすがり : 2006/01/29 19:19
根本的解決でなくていいなら
doctypeはそのままで、
html,body{width:97%;}
を付け加えるとか。

8   名前: 008 : 2006/01/29 19:19  [URL
通りすがりさん、ご提案ありがとうございます。

その方法だと横スクロールは消えますが、スクロールバーの色指定などが
反映しないようなんです。

元帥さんの紹介サイトの説明を読むと、IEのバグだと言う事だそうです。
そのサイトにも解決案が提案されていましたが、何故かうまく行きませんでした。

理由の解っているバグなら修正してほしいですね。

でも、他のサイトでフレーム内にページを表示している人たちはどんな風に
解決しているんでしょうか?不思議です。

9   名前: あわよ : 2006/01/29 19:19
私も以前困っていて、
私の場合はIFRAMEなんですが、

<IFRAME src="**.html" name="***" width="***" height="***" frameborder="0" scrolling="AUTO">
</IFRAME>

としておいて、

スタイルシートで
html {
scrollbar-base-color:#******;
scrollbar-arrow-color:#******;
scrollbar-darkshadow-color:#******;
scrollbar-face-color:#******;
scrollbar-highlight-color:#******;
scrollbar-shadow-color:#******;
overflow-x:hidden;
}

CSSの
「BODY{」を「html{」にしてoverflow-x:hidden; を足しました。

解決になっているかどうかわかりませんが、
とりあえず、私のやっている方法です。

10   名前: 008 : 2006/01/29 19:19  [URL
あわよさん、お返事ありがとうございます。

やってみました。おお!出来てます!
ちなみに、overflow-x:hidden; を、overflow-y: scroll; にしてみたら
更にパーフェクトになったような気がします。

overflow-x:hidden; だと縦スクロールの幅分ページが狭くなるところを改善
できているような気がします。

それにしても一筋縄では行きませんね。タグ打ち大変です。

ご支援頂いた皆様、どうもありがとうございました!

一覧へ戻る