向左浮动,文本对齐中心或显示内联但断线?

时间:2012-03-12 11:34:38

标签: css css-float

我在ONE UL中有导航

此单个列表需要在某个li

的两行上

需要以视觉为中心。

通常我会将它放在两个单独的UL中,并在LI上使用文本对齐中心,但我无法访问HTML。

我尝试将lis左侧漂浮并使用clear:在LI我想要打破但是文本对齐中心不再有效。我可以把左边距放在第一个li和li上,我希望中断假文本对齐,但网站是液体,所以宽度需要改变。

这几乎就像我需要使用一个显示块 - 或者在这里打破,但允许下一行与它内联。

我认为也许我可以将生成的内容用于某个东西,但它至少需要在ie7中使用。

任何想法?

提前致谢。

1 个答案:

答案 0 :(得分:0)

我想我已经解决了。对不起,我的问题不明确 - 我会尝试澄清,然后展示我是如何修复它的。

说我有一个清单:

<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
</ul>

我想要水平显示但超过两行 - 有点像两个用lis设置显示的内联:内联。像这样:

<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
<ul>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
</ul>

但我无法编辑HTML。

通过浮动所有列表项目但在项目4上添加一个清除:左侧非常容易。

我的问题是lis也被设置为text-align:center并且通过向左浮动它们对齐左边。我可以为第1和第4项添加边距,但布局是液体,因此不起作用。

最后,我将所有lis保持为显示:内联,但在项目3中添加了“white-space:pre”。这意味着Item 4可视地在下面开始一个新列表,但两个列表仍然集中对齐。 / p> 然后我遇到了另一个问题,即这两个列表之间的差距非常大 - 一条线的大小突破到大,所以我将线高度减半,这一切都运行得很好。

未检查IE6但已在PC上检查过&lt; 9 FF和chrome。需要检查野生动物园。

希望能帮助别人!