html - CSSオーバーフロールールにはオブジェクトの境界線が含まれていますか?

Question

ボーダーが割り当てられた「div」要素があるとします。オーバーフロー ルールが「非表示」に設定されている場合、「div」の境界線上にあるコンテンツは表示されなくなります。

これを克服する方法はありますか？私のシナリオでは、境界線上にあるコンテンツが消えないようにすることが非常に重要だからです。境界線も含めるには、要素の境界線が必要です。

Answer 1

これを達成するには3つかかると思いますdiv's（おそらく誰かが2つの解決策を考え出すことができますdiv）。ここにフィドルの例があります。ネストされた 3 つdivの要素 (ここでは外側に.CropItクラスがあります):

CSS

.CropIt {
    overflow: hidden;
    width: 60px;
}

.CropIt > div {
    border: 20px solid red;
    width: 20px;
}

.CropIt > div > div {
    margin: -20px;
}

外側は、非表示の境界線を越えて非表示になるようにオーバーフローを設定します。中央は幅と境界線を設定します (外側はその合計幅に一致するかfloat、ラップを縮小するために使用する必要があります)。最も内側のセットは、中間の境界線を越えてコンテンツを押し出すための負のマージンであり、中央への境界線のオーバーラップを作成しますdiv。