Question

我有一个菜单，当窗口较小时，我有多行文字。我搜索如何使文本对齐。但是文本在第一部分下面而不是在我的文本/跨度的开头。我不能使用css flex，因为它在IE9和IE10上不受支持。

<ul>
  <li class="menu13">
    <span class="number">1</span>
    <span class="dot">.&nbsp;</span>
    <span class="text">menu 1</span>
  </li>
  <li class="menu2">
    <span class="number">2</span>
    <span class="dot">.&nbsp;</span>
    <span class="text">menu 2 is so long that I need to find a way to align multiple line. So I want no padding left on the second line. But I cant use css flex because it not working on IE9. I cant use width (like menu 5).</span>
  </li>

https://jsfiddle.net/at24sxmx/

你可以看到我的小提琴上的菜单3，用flex制作（我搜索另一种选择）

Answer 1

只需删除.menu4 span选择器并更新您的HTML：

<span class="number">4</span><span class="dot">.&nbsp;</span><span class="text">menu 4 - test with block . Not working, so Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah Blah.</span>

确保您删除 HTML中的新行字符，结果如下：https://jsfiddle.net/at24sxmx/5/

使用css在多行上对齐文本

1 个答案: