我在父div中有2个DIV,它们以内联方式显示。问题是2 DIVS中的一个也需要内联显示,这阻止了我们两者的居中。基本上我需要左侧的内联按钮和总结右侧页面信息的文本。文本和按钮必须居中。 https://jsfiddle.net/yLnt56ew/1/
.all_parent {
text-align: center;
margin: auto;
}
.Box_button {
height: 200px;
width: 200px;
font-size: 20px;
background-color: #4286f4;
margin: 15px 15px;
-webkit-box-shadow: 0px 0px 13px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow: 0px 0px 13px 0px rgba(50, 50, 50, 0.75);
box-shadow: 0px 0px 13px 0px rgba(50, 50, 50, 0.75);
vertical-align: middle;
display: inline-block;
}
.Box_button:hover {
background-color: #1e75ff;
}
.box_text {
font-family: Arial;
color: white;
margin-top: 95px;
text-align: center;
}
.Box_parent {
max-width: 700px;
}
#project_line {
display: inline-block;
vertical-align: top;
}
.project_text {
text-align: left;
max-width: 350px;
font-size: 19px;
font-family: Arial;
margin-left: 50px;
}

<div id="all_parent">
<div class="Box_parent" id="project_line">
<a>
<div class="Box_button">
<div class="box_text"> TEST </div>
</div>
</a>
<a>
<div class="Box_button">
<div class="box_text"> TEST </div>
</div>
</a>
<a>
<div class="Box_button">
<div class="box_text"> TEST </div>
</div>
</a>
<a>
<div class="Box_button">
<div class="box_text"> TEST </div>
</div>
</a>
<a>
<div class="Box_button">
<div class="box_text"> TEST </div>
</div>
</a>
<a>
<div class="Box_button">
<div class="box_text"> TEST </div>
</div>
</a>
</div>
<div id="project_line" class="project_text">
<h1>TEST </h1>
<a> TEST</br> random text and some more random text! random text and some more random text! random text and some more random text! </br></br> TEST </br> random text and some more random text! </a>
</div>
</div>
&#13;
答案 0 :(得分:1)
&#34; all_parent&#34;是一个ID不是一个类。
将CSS中的%PATH%;%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools
更改为.all_parent
并确保居中工作。
另外,您应该仔细检查您的标记,因为您要省略元素的结束标记。