css - 親内でスクロール可能なコンテンツを選択しないようにする

Question

私はreact-selectをGrommetと組み合わせており、次のように Grommet FormField コンポーネント内で選択を行います。

<FormField label="Country">
   <Select options={options}/>
</FormField>

小さい画面では問題なく動作します:

ただし、より大きな画面では、選択したコンテンツは親 (FormField) コンテナー内でスクロール可能です。

オフに切り替えるposition: absoluteと、選択したコンテンツがコンテナーの外側に表示されますが、フォーム全体のサイズが変更されます。

他に何をチェックまたは試すかについてのアイデアはありますか?

Answer 1

これと同じ問題がありました。私にとってそれを修正したのは、Grommet UX FormField コンポーネントで次のように設定することでした。

overflow: inherit !important;