Текст обтекает плавающий div, но границы и

---

не имеют

, у меня будет div, который является float: right , и он находится внутри родительского div. Внутри того же родительского div есть элементы p , и текст правильно обтекает div float: right .

Однако, если я установил p ] элементы, чтобы иметь границу, или сделать

---

, граница не заканчивается там, где останавливается текст, но простирается за float: right div.

Вот красивое изображение ситуации в mspaint:

Обратите внимание, что зеленая часть черной горизонтальной линии находится за плавающим div.

Как сделать так, чтобы граница или

---

или что-то еще, чтобы ширина была равна ширине текста и не выходила за div?