时间戳

首页 > 解决方案 > 边距：0 自动；不在父级中居中 div

html - 边距：0 自动；不在父级中居中 div

问题描述

我有以下 div 安排，以及以下 css。网上到处都说你需要 margin:0 auto; 居中，但文字仍然在右上角，

任何帮助表示赞赏。

.menu_item {
  margin: 0 auto;
}
<div style='position:absolute;width:110%;height:110%;left:-5%;top:-5%;background-color:white;z-index:7;overflow:none;'>
  <div id='menu_but' style='width:36px;height:36px;'>
    <div class='menu_line' />
    <div class='menu_line' />
    <div class='menu_line' />
  </div>
  <div id='menu'>
    <div class='menu_item'>HOME</div>
    <div class='menu_item'>ABOUT US</div>
    <div class='menu_item'>CONTACT US</div>
    <div class='menu_item'>PORTFOLIO</div>
  </div>
</div>

标签： htmlcss

解决方案

首先，<div>它不是一个自闭合标签，所以你必须写</div>而不是<div class='menu_line'/>

然后，您可以简单地执行以下操作： 

<style>
.menu_item{
    display: inline-block;
}
#menu {
    position: relative;
    text-align: center;
}
</style>
<div id="menu">
    <div class="menu_item">HOME</div>
    <div class="menu_item">ABOUT US</div>
    <div class="menu_item">CONTACT US</div>
    <div class="menu_item">PORTFOLIO</div>
</div>

推荐阅读