html - 图像和文本未在 html 中显示中心

Question

您好，下面的代码 Logo 和文本未显示。当我将样式添加到 vertical-align:center 时。我希望图像和文本居中

谁能帮帮我

.logo{
  
  display:inline-block;
}
.logo a {
  font-size: 3em;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 600;
  color: #fff;
  font-family: "Roboto Slab", serif;
}
.logo a img{
    vertical-align:middle;
}
.logo p {
  color: #000;
  text-transform: uppercase;
  font-size: 1.2em;
  margin-top: -10px;
  display:inline-block;
}

<div class="logo">
   			<a href="index.html"><img src="images/logo_sml.jpg"></a>
   			<p>Newton Public School<br>
			Kanaka Nagar-Rt Nagar<br>
			Reach Out, Reach High, Reach Beyond</p>
   			</div>

Answer 1

像这样更新日志类:

  .logo{
       text-align: center;
       display:inline-block;
       width:100%;
  }