JSFiddle - React, Tailwind, and code Playground

by yijiang

HTML

<div id="c1">
    <p><img src="http://static.arstechnica.net/assets/2010/10/feat-fallout-vegas-sq-thumb-200x200-17278-f.jpg" alt="" />The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. </p>
    <ol>
        <li>The standard chunk of Lorem Ipsum used since the 1500s.</li>
        <li>The standard chunk of Lorem Ipsum used since the 1500s.</li>
        <li>The standard chunk of Lorem Ipsum used since the 1500s.</li>
        <li>The standard chunk of Lorem Ipsum used since the 1500s. They are also reproduced in their exact original form</li>
        <li>The standard chunk of Lorem Ipsum used since the 1500s.</li>
    </ol>
</div>

CSS

#c1 { 
    margin: 20px auto;
    text-align: left;
    width: 350px;
    line-height: 1.3em;
}

p {
    color: #333;
    margin-bottom: 10px;
}

img { 
    border: 1px solid #ddd;
    float: left;
    margin : 0 10px 10px 0;
}

ol {
    clear: both;
}

li {
    color: #a07121; 
    list-style: outside circle none;
    margin: 6px 0;
}