如果我的文字长度在li div中很大，那么div span和li height会自动调整..？

Question

这是我的li标签。

我想让它自动调整li，span和div标签高度，如果文本长度在左右div标签中很大。 我想把左右div宽度= 50％

我想要这种类型的li，如果左右div中的文本长度很大，则下面有screeshot

提前致谢。

<li style="height:35px;border-bottom:1px solid #ddd;">
  <span style="height:35px;display:flex;">
      <div style="position:absolute;float:right;right:10px;margin-top:8px;" id="ui-id-2" tabindex="-1">Ariana Grande Is Looking Beautifull</div>
      <div style="display:none;">2</div>
      <div style="position:absolute;float:left;left:10px;margin-top:8px;" class="garshuninamefont">Justin Biber Selena Gomez</div>
  </span>
</li>

Answer 1

删除了height: 35px;的{​​{1}}。

＆＃13;

＆＃13;

li

＆＃13;

＆＃13;

＆＃13;

Answer 2

不太清楚为什么flex + float + absolute + height。

对于flex ， float，height和absolute可能会被删除：

＆＃13;

＆＃13;

<li style="height:35px;border-bottom:1px solid #ddd;">
    <span style="height:35px;display:flex;justify-content:space-between">
    <div style="font-family:SertoJerusalem;margin:8px 10px;" id="ui-id-2" tabindex="-1">Ariana Grande Is Looking Beautifull</div>
    <div style="display:none;">2</div>
    <div style="margin:8px 10px;" class="garshuninamefont">Justin Biber Selena Gomez</div>
  </span>
</li><li style="border-bottom:1px solid #ddd;">
    <span style="display:flex;justify-content:space-between;align-items:center;">
    <div style="font-family:SertoJerusalem;margin:8px 10px;" id="ui-id-2" tabindex="-1">Ariana Grande Is Looking Beautifull</div>
    <div style="display:none;">2</div>
    <div style="margin:8px 10px;" class="garshuninamefont">Justin Biber <br/>Selena Gomez</div>
  </span>
</li>

＆＃13;

＆＃13;

＆＃13;

这可能对阅读https://css-tricks.com/snippets/css/a-guide-to-flexbox/

很有用