将4个DIV对齐到一个页面的中心
问题描述:
我有一个4页div的并排页面。将4个DIV对齐到一个页面的中心
目前divs粘在左边。
我试图将div的容器和文本对齐,但它不起作用。
这里是我使用,我删除一些图像的URL等
#downloads {
text-align: center!important;
}
.dl-buttons {
text-align: center!important;
}
- I know this is duplicate but was testing .windows a {
width: 190px;
height: 190px;
display: inline-block;
float: left;
}
<div id="downloads">
<div class="row dl-buttons">
<div class="col-3 col-6-sx windows">
<a class="bt1" href="#"></a>
</div>
<div class="col-3 col-6-sx mac">
<a class="bt1" href="#"></a>
</div>
<div class="col-3 col-6-sx android">
<a class="bt1" href="#"></a>
</div>
<div class="col-3 col-6-sx ios">
<a class="bt1" href="#"></a>
</div>
</div>
</div>
- 所有其他类/ MAC /安卓/ iOS设备都是一样的
答
.dl-buttons{
width: 100%;
text-align: center;
}
.dl-buttons > div {
width: auto;
display: inline-block;
}
+0
谢谢。这工作完美。 – DaveYme
答
以下是适合您的小型工作代码。
.dl-buttons {
width: 100%;
text-align: center;
}
.dl-buttons>div {
width: auto;
display: inline-block;
}
<div id="downloads">
<div class="row dl-buttons">
<div class="col-3 col-6-sx windows">
<a class="bt1" href="#">s</a>
</div>
<div class="col-3 col-6-sx mac">
<a class="bt1" href="#">a</a>
</div>
<div class="col-3 col-6-sx android">
<a class="bt1" href="#">f</a>
</div>
<div class="col-3 col-6-sx ios">
<a class="bt1" href="#">e</a>
</div>
</div>
</div>
的可能的复制[如何水平的报头内的div中心两个div?](https://*.com/questions/11582226/how-to-horizontally-center-two -divs-within-a-header-div) – Rob