次のような状況があります。
<div style="max-width:300px;overflow-y:auto;overflow-x:scroll">
<a href="#" style="display:block">sometext 1</a>
...
<a ...>...</a>
</div>
これは簡略化されたバージョンです。長いコードを読むのがいかに退屈であるかを知っています:) 次に、div で tne max-width プロパティを正しく使用する必要があります。クロスブラウザ ソリューションは必要ありません。最新のブラウザのみがサポートされています。
問題：
A 要素のコンテンツにスペースがある場合、スペースの直後にラップされます。したがって、この場合、「sometext」が 1 行に、「1」が別の行に表示されます。これは 300px まで折り返されるべきではありません。
A要素に「max-width:300px」を追加すると、「1」はラップされませんが、パディングは無視され、ファイアバグを通して見ると、数値「1」は依然として範囲外に見えます。
これを正しく説明できたかどうかはわかりませんが、できたことを願っています。
質問が理解できない場合:
上記の構造で「ポップアップメニュー」要素を作成して、自動拡張できるようにする必要がありますが、300x200 px までです。限界に達しています。
ご感想ありがとうございます
アップデート
Opera はこのタスクでうまく機能しているように見えますが、Firefox はそうではありません。次に例を示します。