JSFiddle - React, Tailwind, and code Playground

by 규연 황

HTML

<dl>
    <dt>가나가나가나가나가나가나</dt>
    <dd>가나가나</dd>
    <dt>가나가나</dt>
    <dd>가나가나가나가나가나가나</dd>
    <dt>가나가나가나가나가나가나</dt>
    <dd>가나가나</dd>
    <dt>가나가나</dt>
    <dd>가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나</dd>
    <dt>가나가나가나가나가나가나</dt>
    <dd>가나가나</dd>
    <dt>가나가나</dt>
    <dd>가나가나가나가나가나가나</dd>
    <dt>가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나가나</dt>
    <dd>가나가나</dd>
</dl>

CSS

dl, dt, dd {
    padding:0;
    margin:0;
    font-size:12px;
    line-height:1.4;
    color:#fff;
}
dl{
    /* width:400px; */
    border:1px solid #eee;
}
dt {
    clear:left;
    float:left;
    display:block;
    margin:0 0 1px;
    width:100px;
    
}
dd {
    padding:0 0 0 100px;
    margin:0 0 1px;
    background:#000;
}
dd:after {
    content: "";display: table;clear: both;
}