overflow-y:visibleが効かない

制作しているサイトにおきまして

overflow-x:hidden;
overflow-y:visible;

としたい要素があるのですが、1)を設定するとなぜかoverflow-yも
強制的にhiddenされてしまいます。
制作サイト

確認しているブラウザは以下の通りです。
Chrome>>バージョン: 65.0.3325.162（Official Build）（64 ビット）

ブラウザの実相状況を見る限り、
概ね、ほとんどのブラウザで適切にサポートされているように見えます。
MDN

龍がわかる方がいれば、アドバイスを賜れればと思います。
よろしくお願い申し上げます。

css
1//common.css 136行目
2@media screen and (max-width: 1500px)
3#accordion_wrapper {
4    overflow-x: hidden;
5    overflow-y: visible;
6}

defghi1977

2018/03/18 13:33

もしかして https://teratail.com/questions/110554

行動規範の内容に同意します

回答1件

ベストアンサー

サンプルを拝見しましたが当該css適用部分は overflow-y: hidden; の動きには
なっていないように感じましたが具体的にどの部分がhiddenされていますか？

投稿2018/03/18 14:04

yuka_ceto

総合スコア85

SugiuraY

2018/03/18 15:44

コメントありがとうございます。例えばですが、【賃貸/購入選択】＞【資産選択】を選択いただいたのちに、土地固有情報を選択いただき、北側斜線のボックス等を選択いただくと、class="detailwrapper"を超えて表示して欲しいのに、枠内に目一杯表示しようとします。裏を返えしますとclass="detailwrapper"をscrollしなければ、selectのoptionが全て見ることができません。これを回避するためにoverflow-yをvisibleに指定しているつもりなのですが、効きません。そしてなぜか、横へのoverflowを隠すためのoverflow-x: hidden;を解除すると効いてしまう状況です。 defghi1977様がご指摘の通り、これらは両立しえないプロパティなのでしょうか。。よろしくお願い申し上げます。