:before
または のいずれかを使用して要素を作成し、要素:after
の途中で親の下部に配置して、ボックスの影を非表示にしようとしています。IEを除いて、これはうまくいくようです。
デモンストレーション: http://jsfiddle.net/XV6pT/
からの白い境界線は:before
、下の境界線とそのボックスの影を覆う必要があります。ただし、Internet Explorer では、ボタンの下の境界より下の要素の部分は表示されません。
何かを非表示に設定するフィルターなどはありません ( How do I stop Internet Explorer's propriety gradient filter from cut off content that should overflow? によると)。CSS はそのままコピーされます。
一般的な目的 (おそらく誰かがより良いアイデアを持っている) は、ボタンの下にドロップダウン ナビゲーションがあり、ドロップダウンとボタンが「1 つの部分」であるように見える必要があるため、間に境界線やボックスの影があってはならないことです。ボタンとドロップダウン。
問題はIE9とIE10で発生するようです。絶対位置から相対位置への切り替えも役に立ちませんでした。
ヒントはありますか?