Оборачивая содержимое span внутри li, чтобы оно оставалось в своем собственном столбце

Question

У меня есть список, каждый ли в нем имеет такую ​​структуру:

<li>
  <img class="yes" src="...">
  <img class="no"  src="...">
  <span class="a">...</span>
  <span class="b">...</span>
</li>

теперь, если содержимое класса b длинное, оно будет обтекать изображение. Я не хочу, чтобы оно было обернуто под изображение, я хочу, чтобы оно оставалось в отдельной колонке. Если есть что сделать, пожалуйста, дайте мне знать, что использовать таблицы для этого будет просто неправильно. Спасибо! Нима

Answer 1

Спасибо, Дуилай,

Я добавил div. Вот CSS, который сделал трюк:

.divClass
{
    margin-left:30px;
    text-align:left;
}

.yes, .no
{
    float:left;
    width:15px;
}

Answer 2

Вы можете сделать пару вещей;

1) Добавьте отступы внизу изображения, чтобы занять место, в которое обычно помещается текст span. Быстро и просто, но не реалистично для динамических страниц.

2) Оберните div вокруг промежутков. Затем поместите элемент div вправо с левым полем размера столбца изображения. Это создаст контейнер div, который не будет обтекать изображение.