带有显示块的li内的输入看起来不太好，为什么？

Question

When I put an input with type=text within a li item with display:block I get weird results? Here is an example:

<ul>
    <li><input type="text" value="withvalue" style="display: block" /></li>
    <li><input type="text" style="display: block" /></li>
</ul>

For the first input I can only see the bullet when the input is focused and it's inside the input . For the second input , it is not in the same line as the li parent bullet.

Can someone please explain it and maybe suggest a fix?

Thanks

Answer 1

使用

<li style = "display:inline;"> ... </li>

Answer 2

try without style="display: block"

<ul>
    <li><input type="text" value="withvalue" /></li>
    <li><input type="text" /></li>
</ul>