Question

我想在页面上水平居中一个div（div包含四个像径向刻度盘一样，需要彼此相邻而不是一行接一个）。我当前的CSS（下面）显示彼此相邻的量表，因此float属性似乎工作正常，但我为父div设置的margin属性（allgauges）似乎没有效果。事实上我在＆＃34; allgauges＆＃34;中有几个div。当我尝试将其与页面中心对齐时有所作为？任何帮助表示赞赏。

＆＃13;

<!-- Embedded style sheet to change the margin spacing between the gauges -->
    <style>
     
     
    #one, #two, #three, #four
    {
	float: left;
	}
	 
    #allgauges
    {
		margin: 0 auto;
	}
        
    </style>

＆＃13;

Answer 1

这个问题已被多次回答。这是解决方案：

＆＃13;

.one,.two, .three,.four
{
  display:inline-block;
  vertical-align:middle;
  width:25%;
  text-align:center; /* This is not necessary.*/
  font-size:13px;
}
	 
.allgauges
{
   font-size:0;
}

＆＃13;

<div class="allgauges">
  <div class="one">1</div>
  <div class="two">2</div>
  <div class="three">3</div>
  <div class="four">4</div>
</div>

＆＃13;

如何将div（带子div）水平居中放置在页面上？

1 个答案: