Упорядоченный список неожиданно отображается неправильно в Chrome

Question

Я использовал этот код в течение некоторого времени, и внезапно он отображается неправильно в Chrome (все еще выглядит хорошо в Safari, хотя). Я использую переупорядоченный список для отображения заголовка, за которым следует абзац. То, как он всегда работает, показывает номер с текстом справа. Теперь он заставляет текст заголовка под номером.

Пример: http://cigarwars.net/2016/12/cigar-weekly-rankings-december-15-2016/

Любая помощь в том, как заставить его для отображения текста рядом с номером будет оценена.

<ol style="list-style: decimal; list-style-position: inside; margin-left: 0px; display: inline-block;" reversed="reversed"> 
<li> 
<h3>Honey &amp; Hand Grenades</h3> 
<img class="alignright size-thumbnail wp-image-2575" src="http://cigarwars.net/wp-content/uploads/2016/12/viaje-honey-hand-grenades-cigar-e1482430211220-200x200.jpg" alt="Viaje Honey &amp; Hand Grenades cigar" width="200" height="200" />Viaje Honey &amp; Hand Grenades is one of the most recognizable cigars in the world of craft/boutiques, using figurado shapes and bright, foil-wrapped packaging. The cigars use a Nicaraguan puro blend and have been made for 2012, 2013, and 2016 small-batch releases. 

<a href="http://cigarwars.net/?p=2536">More info...</a> 

[su_list icon="icon: minus" icon_color="#b9b9b9"] 
<ul> 
<li>Wins: 14</li> 
<li>Losses: 16</li> 
<li>Record: 46.7%</li> 
</ul> 
[/su_list] 
</li></ol> 

Answer 1

h1-h6 заголовки являются элементами уровня блока. Как правило, они отображаются в следующей строке, если вы поместите их в элемент li. Вы можете изменить это поведение с укладки аналогично ниже:

h3 
{ 
    display:inline; 
} 

Попробуйте это и посмотреть, если поведение удовлетворяет ваши требования.