web-dev-qa-db-ja.com

オーバーフロー:非表示。 ChromeではIFRAMEを使用しますか?

Cssとhtmlにオーバーフローが隠されたIFRAMEがあります。 Firefoxでは動作しますが、Chrome/Safariでは動作しません

どうしてこれなの?

41
dukevin

そうですね

<iframe scrolling="no" src="http://www.google.com" width="400px" height="300"></iframe>

scrolling="no"

http://jsfiddle.net/neSBS/

73
Joonas

このテーマについてかなり大きな調査を行った後、回答を投稿したいと思います。これは、Joonasの回答に追加することをお勧めします。

<style>
    iframe {
        overflow:hidden;
    }
</style>
(...)
<iframe scrolling="no" src="http://www.google.com" width="400px" height="300"></iframe>

scrollingoverflow:hiddenを提供する必要がありますが、このソリューションはChromeとHTML5 doctypeの組み合わせでは機能しません。scrolling属性はHTML5およびoverflowプロパティはChromeのiframeに影響を与えません。 HTML5仕様 が明確に述べているので、後者はバグだと思います:

さらに、HTML5には、HTML4にあったプレゼンテーション属性がありません。これらの関数はCSSにより適切に処理されるためです。
(...)
-tdおよびthのnowrap属性。
-テーブルのルール属性。
-iframeのスクロール属性
-時間のサイズ属性。
-liのtype属性、およびul。
(...)

明確に言われています-HTML5ではscrollingをCSS overflowに置き換える必要があります。

12
matewka

奇妙な-変換:rotate(0.00001deg); overflow:hiddenを含むdivの場合。私に役立ちます。

2
be3
<style>
    iframe::-webkit-scrollbar {  
    display: none;
}  
</style>

- Safari/Chrome(Webkit)-iframe垂直スクロールバーを非表示にできません

1
Ian Everall