css ul li 靠左對齊，換行

標籤：splay   log   img   ica   lis   換行   top   inline   nbsp   

.info-warp {    min-height: 20rem;    background: #ffffff;    text-align: center;    padding: 1.4rem;}.jx_ul-info-list {    margin: 2rem auto;    text-align: left;    display: inline-block;    list-style-type: none;}.jx_ul-info-list li label {    width: 50%;    display: inline-block;    text-align: right;    vertical-align: top;}.jx_ul-info-list li span {    width: 50%;    display: inline-block;}

 <div class="info-warp">        <p class="success-text">恭喜您！報名成功</p>        <ul class="jx_ul-info-list">            <li>                <label for="">賽事名稱：</label><span>Crossfit</span>            </li>            <li>                <label for="">項目名稱：</label><span>Crossfit May</span>            </li>            <li>                <label for="">姓名：</label><span>aa</span>            </li>            <li>                <label for="">賽事名稱：</label><span>0001</span>            </li>            <li>                <label for="">場館：</label><span>場館場館場館場館場館場館場館場館</span>            </li>        </ul>        <div class="weui_btn_area weui_btn_area_inline">            <a href="javascript:;" class="jx_btn bg-blue2-b">查看我的賽程表</a>            <a href="javascript:;" class="jx_btn weui_btn_blue">查看其它項目</a>        </div>    </div>

實現左右對稱，文字換行

 

css ul li 靠左對齊，換行