在DIV中居中无序列表
在DIV中居中无序列表
提问于 2011-09-03 04:37:54
嗯，我正在重新设计我的网站AlternativeApps.TK，以便让用户获得最佳体验。
我有一个名为devices的div，其中包含Windows图标、Linux、Mac、Android和iOS设备的图像。设备下面是它们的名称。文本在它们的图标下居中，但我似乎不知道如何在同一div中水平居中所有图像和文本，而不是像现在这样垂直向下移动。
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-09-03 04:43:06
编辑以获取有关水平布局的新信息：
#devices > ul {display: inline-block;}那里!这就是您需要添加的全部内容。没有讨厌的易碎的漂浮物。
Stack Overflow用户
发布于 2011-09-03 04:39:40
好的，我误解了这个问题，一开始试着这样做。
#devices{
margin: 0 auto;
}
ul li{
float: left;
margin-left: 10px /* arbitrary value to stop them from hitting eachother */
text-align : center;
}然后将您的标记更改为类似于
<div id="devices">
<ul>
<li>
<img src="your image"/>
<p>your text</p>
</li>
<li> ... so on</li>
<li> ... so on</li>
</ul>
</div>Stack Overflow用户
发布于 2011-09-03 04:41:58
div#devices ul { display:block; float:left; }页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/7288985
复制相关文章
相似问题