アプリ版：「スタンプのみでお礼する」機能のリリースについて

firefoxでdivタグ要素が突き抜ける

解決済

お世話になります。
firefoxですとdivタグで指定した高さ・幅を要素が超えると
突き抜けて表示されます。IEだと、指定した幅・高さが大きくなってくれる。

以下のソースで子の要素が親のボックス、子のボックスを突き抜けなくできないでしょうか？
もしかしたら簡単なことなのかもしれませんが、
ご教授よろしくお願いいたします。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
#oya {
border-right:orange 1px solid;
border-top:orange 1px solid;
border-left:orange 1px solid;
border-bottom:orange 1px solid;
}
#ko {
border-right:green 1px solid;
border-top:green 1px solid;
border-left:green 1px solid;
border-bottom:green 1px solid;
}
</style>
</head>
<body>
<div id="oya" style="width:200px;height:200px;">
<div id="ko" style="width:100px;height:100px;">ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ</div>
</div>
</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (4件)

No.1

  • 回答者： 345itati
  • 回答日時：

#ko {


border-right:green 1px solid;
border-top:green 1px solid;
border-left:green 1px solid;
border-bottom:green 1px solid;
overflow: auto;
}
ではみ出た部分の表示方法をoverflowで指定してやって下さい。autoにすると、定められた大きさより内容がはみ出す場合、スクロールバーが表示されてスクロールする事により中が閲覧出来ます。
デフォルトではoverflow: visible;の値ですが、これで勝手にボックスを拡大してくれるのはIEの余計なお世話です。visibleをどう表示するかはブラウザ依存です。
    • good
    • 0
    • 件
通報する
この回答へのお礼

345itati様、ご教授有難う御座います。
overflowで、スクロールすることにより閲覧できました。
が、スクロールを出さないで、IEのようにボックスを拡大するようにしたいのですが、出来ないでしょうか？

通報する
お礼日時：2006/10/26 23:02

No.2

  • 回答者： quads
  • 回答日時：

回答は既にされているので割愛します。


HTMLソースを提示する際はDTDも併せて提示してください。
確認されている環境、HTMLによって回答が異なる場合があります。
    • good
    • 0
    • 件
通報する

No.3

  • 回答者： ratoa
  • 回答日時：

#1で言ってますが、ボックスの大きさが内容量によって変わってしまうのはIEのバグです。

この場合、ボックスの大きさが変わらず中身が飛び出すFirefoxが正しいです。
内容物の量によって大きさを変えたいなら、heightを指定しないことですね。
    • good
    • 0
    • 件
通報する
この回答へのお礼

ratoa様、ご教授有難う御座います。
やはりheightの指定をすると内容物が大きくなると
ボックスの大きさは変わらないんですね。
javascriptを作成しないとダメそうですね。。。

通報する
お礼日時：2006/10/26 23:31

No.4ベストアンサー

  • 回答者： quads
  • 回答日時：

可変して欲しいなら min-height プロパティを用いるべきでは？

    • good
    • 0
    • 件
通報する
この回答へのお礼

quads様、ご教授有難う御座います。
quads様のお教えにより求めていたものが出来ました。
あと逆にIEでDIVがはみ出さないようにすることって
出来るのでしょうか？

通報する
お礼日時：2006/10/27 12:09

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報