HTML/CSS 文本未对齐

Question

我正在制作一个网站，但我的文本不会与索引介绍 h1 的中心对齐!

.index-intro {
width:100%;
background-color: #00C8FF;
height: 20px;
float:center;
}

.index-intro h1 {
font-family: tpeb;
font-size: 15px;
text-transform: uppercase;
text-align:center;
display:inline-block;
}

<section> 
    <div class="index-intro">
        <div class="wrapper">
	        <h1>Welcome to Anime!</h1>
        </div>
    </div>
</section>

谢谢 :)

Answer 1

这是一组精简的 HTML 和 CSS:

.index-intro {
  background-color: #00C8FF;
  text-align:center; 
}

.index-intro h1 {
  font-size: 15px;
  text-transform: uppercase; 
}

<div class="index-intro">
  <div class="wrapper">
    <h1>Welcome to Anime!</h1>
  </div>
</div>

这也有助于解决垂直对齐问题，因为您已经固定了包含 <div> 的高度.虽然我猜你可能想要那个？

这里有一些填充: https://jsfiddle.net/9a3b4f7g/1/