<p>最初の div にカーソルを合わせて全文を表示すると、2 番目の div の位置が変更され、最初の div の後ろになります。 2 番目の div はそのままにして、最初の div のテキストでそれをカバーしたいと考えています。 </p>
<p><strong>デモ: </strong>https://codepen.io/adivity/pen/OJEzoPm</p>
<pre class="brush:php;toolbar:false;"><html>
<本体>
<div>1) これは表示したい完全なタイトルです。非常に長いので、次の div で完全にカバーされます。
</div>
<div>2) これは表示したい完全なタイトルです。非常に長いので、次の div で完全にカバーされます。
</div>
<div>3) これは表示したい完全なタイトルです。非常に長いので、次の div で完全にカバーされます。
</div>
</div>
</ボディ>
</html></pre>
<pre class="brush:php;toolbar:false;">.container {
最大幅: 100ピクセル;
マージン: 0 自動;
}
.container div {
高さ: 80ピクセル;
背景色: グレー;
}
.container div {
ホワイトスペース: ナラップ;
オーバーフロー: 非表示;
テキストオーバーフロー: 省略記号;
}
.container div:hover {
オーバーフロー: 表示;
ホワイトスペース: 通常;
z インデックス: 2;
最大幅: 100ピクセル;
}</pre></p>
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
リーリーposition:Absoluteを.container div:hoverから削除すると、問題が解決しました。これがあなたが探しているものですか?