我知道关于垂直和水平对齐文本有很多问题,但是我已经尝试了所有方法,但似乎没有任何效果。
我有如下的CSS和HTML结构
* {
margin:0;
padding:0;
}
article {
display:inline-table;
width:190px;
height:260px;
border:1px solid black;
background-color: rgb(255, 253, 233);
position:relative;
margin-left:20px;
margin-top:20px;
}
ul {
display: block;
margin-left: auto;
margin-right: auto;
list-style-type:none;
width:170px;
height:240px;
}
ul li {
position:relative;
padding-top:20px;
color: #8C460E;
font-size:10.666667px;
width:100%;
height:auto;
font-family: Tahoma, Verdana, Arial;
border-bottom:1px dashed black;
text-align:center;
}
<article>
<ul>
<li><span>PRÍPRAVA DOKUMENTÁCIE PODĽA NOVÉHO ZÁKONA O POĽOVNÍCTVE:</span></li>
<li><span>k uznávaniu poľovného revíru</span></li>
<li><span>k zhromaždeniu vlastníkov poľovných pozemkov</span></li>
<li><span>k zmene hranice poľovného revíru</span></li>
<li><span>k zmluve vlastníkov spoločného poľovného revíru</span></li>
<li style="border:0px"><span>k zmluve o užívaní poľovného revíru</span></li>
</ul>
</article>
而且我正在尝试同时垂直和水平对齐文本。我尝试了从
w3.org
到此处的答案的所有内容,但没有任何效果。实现目标的正确方法是什么?Demo
最佳答案
尝试这样:Demo
ul li {
position:relative;
padding:8px 0; / * changed padding top value to this */
color: #8C460E;
font-size:10.666667px;
width:100%;
height:auto;
font-family: Tahoma, Verdana, Arial;
border-bottom:1px dashed black;
text-align:center;
}