内部div自动适合宽度的li在ie [英] inside div automatic fit width of li in ie

问题描述

 < div style ='width：500px'> 
< ul> 
< li> 1行中的某些文字< / li> 
< li> 1行中的某些文字< / li> 
< li>一些文字2行< / li> 
< li>一些2< / li> 
< li> 2< / li> 
< / ul> 
< / div> 
  

我不知道什么是正确的CSS代码显示项目在ie like： p>

前两个结果自动适合在第一行，其余的结果在第二行。

提前感谢

解决方案

我有两种方法来实现我想要的：

选项1：
使< li> 标签 display：block; 和 float：left;

选项2：
使< li> code>标签 display：inline-block; 和 white-space：nowrap;

我会自己去选择2，因为它会避免你可以通过浮动获得的怪癖。

你可能会发现，可能还需要设置< ul> 标记的样式。可能 width：100％; 和/或 display：block; 。

我仍然说 display：inline-block; 和 white-space：nowrap; < li> 标记。但是如果它不工作，如果你用什么方式说它不工作，这将有所帮助。

另外：你也说过一些答案不工作在IE中，但你没有说过哪个版本的IE - IE6,7,8和9有非常不同级别的支持CSS;它将有助于知道你需要支持哪些。

<div style='width:500px'>  
<ul>  
  <li> some text in 1 line</li>  
  <li> some text in 1 line</li>  
  <li> some text 2 line</li>  
  <li> some 2</li>  
  <li> 2</li>  
</ul>
</div>

I don't know what is the correct css code for display of items in ie like:

first two results automatic fit in first line and rest of the results on second line. so basic idea is to let the li get it's own width depending on the data size.

Thanks in advance

解决方案

I see two ways to achieve what I think you're asking:

Option 1: Make the <li> tags display:block;, and float:left;

Option 2: Make the <li> tags display:inline-block; and white-space:nowrap;

I'd go for option 2 myself, as it'll avoid the quirks you can get with floats. Also you may find you end up needing nowrap anyway, even with option 1.

[EDIT]

You may also need to style the <ul> tag. Maybe width:100%; and/or display:block;.

I still say display:inline-block; and white-space:nowrap; should do it for the <li> tags. But if it isn't working, it would help if you said in what way it's not working.

Also: You've also been saying some answers aren't working in IE, but you haven't said which version of IE -- IE6,7,8 and 9 have very different levels of support for CSS; it would help to know which ones you need to support.

这篇关于内部div自动适合宽度的li在ie的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！