按我自己的理解，写出两种方式，不知道是否符合你的要求。
ul{
width:300px
}
ul li{
line-height: 18px
margin-top:15px
overflow: hidden
}
ul li span{
padding-right: 30px
}
.flex{
display: flex
}
.flex span{
flex:1
}
i{
font-style: normal
}
.float{
color:#f20
}
.float i{
float:right
}
<ul>
<li class="flex">
<span>列表内容</span>
<i>2020-02-01</i>
</li>
<li class="flex">
<span>列表内容列表内容列表内容列表内容列表内容</span>
<i>2020-02-01</i>
</li>
<li class="flex">
<span>列表内容</span>
<i>2020-02-01</i>
</li>
<li class="float">
<i>2020-02-01</i>
<span>列表内容</span>
</li>
<li class="float">
<i>2020-02-01</i>
<span>列表内容列表内容列表内容列表内容列表内容</span>
</li>
<li class="float">
<i>2020-02-01</i>
<span>列表内容</span>
</li>
</ul>
你只要把css中news_list_h1前加个点就好 .news_list_h1也就是
.menu_right .news_list_h1{display:inlinefloat:left}
.menu_right
.news_list_h1 li{ border-bottom:#e5e5e5 solid 1px
position:relativefont-size:18pxline-height: 20pxwidth:500px}
.menu_right .news_list_h1 li b{ width:11pxheight:11pxbackground:url(../images/bt2_r3_c2.gif) no_repeat}
.menu_right .news_list_h1 li span{ float:right}
记得给个采纳
