CODEWITHSUNDEEP
htmlcssgoogle-chromehtml-lists
jordanG
jordanG

Reputation: 59

Ordered List Suddenly Displaying Wrong in Chrome

I've been using this code for some time and suddenly it's displaying wrong in Chrome (still looks fine in Safari though). I'm using a reverse-ordered list to display a heading followed by a paragraph. The way it's always worked is displaying the number with the text just to the right. Now it's forcing the heading text underneath the number.

Example: http://cigarwars.net/2016/12/cigar-weekly-rankings-december-15-2016/

Any help on how to force it to display the text next to the number would be appreciated.

<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>

Upvotes: 1

Views: 91

Answers (1)

Rohit Dodle
Rohit Dodle

Reputation: 376

h1-h6 headers are block level elements. They generally show in the next line if you put them into li element. You can change this behavior with styling similar to below:

h3
{
    display:inline;
}

Try this and see if the behavior satisfies your requirement.

Upvotes: 1

Related Questions