HTMLカテゴリに登録しましたが、CSSの質問です。
divタグの大きさをCSSでwidthとheightで指定し、overflow: hiddenの設定をしました。
ここでdivタグ内に文書を書き、それがCSSで指定したdivタグのサイズ(範囲)を超えてしまった場合、はみ出た部分はoverflow: hiddenにより見えなくなります。
画像でも同様だったのですが、何故かFlash(swfデータ)はIE以外のブラウザ(NN、Firefox、Operaなど)で見たところ、overflowが効いていません。隠したい部分も見えてしまいます。なぜなのでしょうか?
ソースは以下になります。
<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/xhtml1/xhtml1-transitional/">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css">
<!--
#clip {
border: 1px solid blue;
width: 500px;
height: 100px;
overflow: hidden;
}
//-->
</style>
<title></title>
</head>
<body>
<div id="clip">
<embed src="flash.swf" width="500" height="250" />
</div>
</body>
</html>
お分かりのように、本来はheight=250pxのswfをheight=100px分だけ表示したいのです。
No.2ベストアンサー
- 回答日時:
flashデータは他の通常出力とは異なり、
わかりやすく言うと、htmlに埋め込まれず特別なレイヤーに
表示されるのでそのような現象になります
ただ単に100pxより下をカットして表示したいのならば、
cssによるoverflowは特に使用せずに、
<embed src="flash.swf" width="500" height="100" scale="noscale" salign="lt" />
とすればよいでしょう
どうしてもoverfrow:hiddenで表示しないようにしたいのならば、
<embed src="flash.swf" width="500" height="250" wmode="opaque" />
のように、htmlに埋め込む記述を追記すれば可能です
ただFlashのwmodeの設定はIE向けに企画された内容とmacromediaが述べています
また、キー操作の不具合等も報告されているので、
できるだけこの方法を避け、前途salign scaleの設定による表示方法の変更をしたほうが無難です
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・人生のプチ美学を教えてください!!
- ・10秒目をつむったら…
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・【大喜利】【投稿~9/18】 おとぎ話『桃太郎』の知られざるエピソード
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
CSSのtransform: translate(-50...
-
aタグに直接style=""で:hoverを...
-
htmlタグ 詳しいかた
-
<h1>タグの後の行間を詰めたい。
-
CSSでテキストを垂直、中央に設...
-
HTMLフォームのSELECTの幅を一...
-
インラインフレームの表示位置...
-
INPUT TEXT内の文字位置を指定...
-
<legend>で表示されるタイトル...
-
スタイルシートと画像リンクの下線
-
エクセルでサイズに合ったもの...
-
Excelの列や行の幅を表示...
-
HTMLでテーブルを縦に並べたい!
-
PDFへてのテキストボックスにて...
-
Excelの列の幅(ピクセル)につい...
-
パソコンでランドルト環の作成...
-
ホームページビルダーで、急に...
-
表の幅が広がる
-
ホームページビルダーの表にお...
-
TABLEの横枠線を点線にしたい
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
CSSのtransform: translate(-50...
-
aタグに直接style=""で:hoverを...
-
インラインフレームの表示位置...
-
<h1>タグの後の行間を詰めたい。
-
HTMLフォームのSELECTの幅を一...
-
macとwindowsのレイアウト崩れ...
-
INPUT TEXT内の文字位置を指定...
-
text-alignの解除の方法
-
ホームページビルダー 空白の...
-
Formタグのブロックの高さについて
-
端から端まで横線を引きたい
-
<legend>で表示されるタイトル...
-
なぜ左に寄っているの?
-
FireFoxで見るとブラウザの幅に...
-
コードを書いて下さい( ; ; )...
-
アップロードするサーバーによ...
-
CSSでh1とその下の文字との行間...
-
文字を内側にも色の付いた枠で...
-
テキストボックスの文字を右揃...
-
Dreamweaverで画面サイズを一定...
おすすめ情報