如何解决如何将元素相对于其父元素居中?
| 我有以下容器:#container {
width: 75%;
margin: 0 auto;
background-color: #FFF;
padding: 20px 40px;
border: solid 1px black;
margin-top: 20px;
}
它是使用nifty:layout Rails生成器生成的。如何将某些内容放在此容器的内部而不是整个页面的中心?
编辑:
很抱歉没有提供更多信息:)。这是我要尝试的重点:
<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:
#nav {
list-style-type:none;
padding:0;
margin:0;
}
#nav li {
display:inline;
}
解决方法
如果您试图将“ 3”个列表元素居中,请给容器
text-align: center
将工作。
如果是关于块元素的,那么@slhck和@anirudh的答案就是解决方案。
, 我想以下应该做。分配一个固定的宽度,然后
#inside-container {
margin-left: auto;
margin-right: auto;
width: 50px;
}
您可以指定顶部和底部边距,但是左侧和右侧的auto
值将使元素居中。
更新:之前没有看到您的代码。有关inline
元素,请参见@Pekka的答案。
, 使div为8ѭ,并为ѭ9and做
.container #innerElement {
position: relative;
width: <set width here>;
margin: auto;
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。