JSFiddle - React, Tailwind, and code Playground

by AndreaLigios

HTML

<div class="dlrs">
    <div id="listItems">
        <div id="clrCode" class="colorBlock" style="background-image: url(" /media/images/orange.png "); background-position: center center; background-repeat: no-          repeat;"></div> <span>0 pts ( > 20 min)</span>

        <ul id="dlrsList">
            <li id="itmDlrName">Crosstown Auto Centre</li>
            <li id="itmDlrName">Dartmouth Chrysler Jeep Dodge</li>
            <li id="itmDlrName">Grande Prairie Chrysler Jeep Dodge</li>
        </ul>
    </div>
</div>

CSS

ol, ul { list-style-type: none; }

#itmDlrName {
    padding: 0px;
    list-style-type:disc;
    position: relative;
    left: 20px;
    max-width: 160px;
    font-size: 12px;
}
#dlrsList {
    width: 100%;
    text-align: justify;
    /*float: left;
    width: 190px;
    margin-right: 14px;
    margin-bottom: 10px;*/
}
span {
    position: relative;
    bottom: 16px;
    left: 20px;
}
.dlrs {
    //display: inline-block;
    width: 630px;
    margin: 20px 0 20px 20px;
    font-weight: @bldTxt;
    font-size: 14px;
}
#listItems {
    width: 200px;
    float: left;
    display: inline-block;
}