如何将一个元素相对于它的父元素居中? [英] How can I center an element relative to it's parent?
本文介绍了如何将一个元素相对于它的父元素居中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有以下容器:
#container {
width: 75%;
margin: 0 auto;
background-color: #FFF;
padding: 20px 40px;
border: solid 1px black;
margin-top: 20px;
}
它是使用nifty:layout Rails生成器生成的。我将如何将这个容器中的某个内容,而不是整个页面?
It was generated using nifty:layout Rails generator. How would I center something inside of this container, and not the entire page?
编辑:
抱歉,不提供进一步的信息:)。这是我想要的中心:
Sorry for not providing further info :). This is what I'm trying to center:
<div id="nav">
<ul>
<% if current_user %>
<li><%= link_to "Sign out",destroy_user_session_path %><span>|</span></li>
<li><%= link_to "New snippet",new_snippet_path %><span>|</span></li>
<% else %>
<li><%= link_to "Login",new_user_session_path %><span>|</span></li>
<li><%= link_to "Register",new_user_registration_path %><span>|</span></li>
<% end %>
<li><%= link_to "Snippets",snippets_path %><span>|</span></li>
<li><%= link_to "Chat",messages_path %></li>
</ul>
</div>
这里是我迄今为止的CSS:
Here's the CSS I have for it so far:
#nav {
list-style-type:none;
padding:0;
margin:0;
}
#nav li {
display:inline;
}
推荐答案
中心 display:inline
列出元素,给出容器
If you're trying to center the display: inline
list elements, giving the container
text-align: center
将工作。
如果是关于块元素,@ slhck和@ anirudh的答案是解决方案。
If it's about block elements, @slhck's and @anirudh's answers are the solution.
这篇关于如何将一个元素相对于它的父元素居中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文