Удалить дополнительные разрывы строк после Html.fromHtml ()

Фактически вы видите верхнее поле элемента #inner collapse в верхнем краю элемента #outer, оставив только поле #outer неизменным (хотя и не показано в вашем изображений). Верхние края обоих ящиков сливаются друг с другом, потому что их поля равны.

Вот соответствующие точки из спецификации W3C:

8.3.1 Коллапсирующие поля

В CSS смежные поля двух или более полей (которые могут или не могут быть братьями и сестрами) могут объединяться, чтобы сформировать единый запас. Поля, которые объединяются таким образом, называются collapse , а полученный комбинированный запас называется скомпенсированным пределом .

Приближение вертикальных полей сворачивается [ ...]

Два поля , примыкающие к , тогда и только тогда, когда:

• к блокам уровня блока в потоке, которые участвуют в том же контексте форматирования блоков
• , нет ячеек, без зазоров, без отступов и без границ, их
• оба относятся к вертикально смежным краю ящика, т. е. образуют одну из следующих пар: верхний край поля и верхний край его первого дочернего потока

. Причина, по которой выполнение любого из следующих действий предотвращает margin of collapsing:

• Плавающий любой из ваших div элементов
• Создание любого из ваших div элементов встроенных блоков
• Установка overflow в #outer на auto (или любое значение, отличное от visible)

Это происходит потому, что:

• Поля между полем с плавающей точкой и любым другим полем не сворачиваются (даже между поплавком и его дочерними потоками).
• Поля элементов, которые устанавливают контексты форматирования нового блока (такие как поплавки и элементы с «переполнением», отличные от «видимых»), не сворачиваются с их дочерьми в потоке.
• Поля коробок inline-block не сворачиваются (даже с их дочерьми в потоке).

Левое и правое поля ведут себя так, как вы ожидаете, потому что:

Горизонтальные поля никогда не разрушаются.