如何水平对齐div? [英] How can I horizontally align my divs?

问题描述

由于某种原因，我的div不会在包含div的水平居中显示

 .row {
  width: 100%;
  margin: 0 auto;
}
.block {
  width: 100px;
  float: left;
} 

 <div class="row">
  <div class="block">Lorem</div>
  <div class="block">Ipsum</div>
  <div class="block">Dolor</div>
</div> 

有时，行div中只有一个块div.我在做什么错了?

解决方案

要实现您想要做的事情:

考虑使用 display: inline-block 代替float.

For some reason my divs won't center horizontally in a containing div:

.row {
  width: 100%;
  margin: 0 auto;
}
.block {
  width: 100px;
  float: left;
}

<div class="row">
  <div class="block">Lorem</div>
  <div class="block">Ipsum</div>
  <div class="block">Dolor</div>
</div>

And sometimes there is a row div with just one block div in it. What am I doing wrong?

解决方案

To achieve what you are trying to do:

Consider using display: inline-block instead of float.

这篇关于如何水平对齐div?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！