【问题标题】：Can't center text in my h1 element in google chrome无法在谷歌浏览器的 h1 元素中居中文本
【发布时间】：2017-10-08 10:44:36
【问题描述】：

我无法在 chrome 中将标题居中。它在 JSfiddle 中运行良好，但每当我将它放入 chrome 中时，它都不会居中。我尝试对块元素使用margin：0 auto，例如and和align-text：center，但它们都不起作用。这是我的 HTML 和 CSS

*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.container,
.grid {
  margin: 0 auto;
  width: 960px;
}

.container {
  padding-left: 30px;
  padding-right: 30px;
}

.col-1-3 {
  width: 33.33%;
}

.col-2-3 {
  width: 66.66%;
}

.col-1-3 {
  display: inline-block;
  vertical-align: top;
}

.grid,
.col-1-3,
.col-2-3 {
  padding-left: 15px;
  padding-right: 15px;
}


/*
  ==============================
  Primary Header 
  ==============================
*/

.logo {
  text-align: center;
}

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>Rysh</title>
  <link rel="stylesheet" href="Assets/stylesheets/main.css">
</head>

<body>
  <header class="container logo">
    <h1>Rysh</h1>
    <nav>
      <a href="shop.html">Shop</a>
      <a href="about.html">About</a>
    </nav>
  </header>
</body>

</html>

谁能明白为什么它不能在 Chrome 中运行？

【问题讨论】：

您能否提供一个链接或其他内容，以便我们可以在屏幕截图中重现您的问题？否则，不可能找到根本原因。顺便说一句，您需要删除固定的width: 960px; 以使其更具响应性。
在您的代码 sn-p 中，样式表 Assets/stylesheets/main.css 无法加载，因为它是相对路径。
@shaochuancs 你知道我在这里分享文件的方法吗？这是一个小文件夹
您可以在main.css中提取相关的CSS代码，并将它们与您当前的sn-p放在一起。无需在此处附加所有代码。实际上，一个缩小的、完整的和可验证的示例将使我们更容易为您提供帮助。
对不起@shaochuancs我没看懂你的意思，我相关的CSS都在上面，你看不到吗？

标签： http text centering

【解决方案1】：

尝试使用

雷什

或

瑞什

或

瑞诗

【讨论】：