首页 > 解决方案 > 无法将对象居中到页面中间

问题描述

我正在尝试将“注册”框居中放置在屏幕的中心,但无论我尝试什么,一切都停留在页面的左侧。目前,我试图以“主要内容”为中心。

它看起来像什么

在我的 .html 和 style.css 中,我有以下内容:

.signbox {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -100px;
}
<div class="singbox">
  <h2>Main Content</h2>
  <p>Other info about the site goes here</p>
</div>

我已经使用这个网站来解决这个问题,但正如你从截图中看到的那样,它不起作用。-> https://css-tricks.com/quick-css-trick-how-to-center-an-object-exactly-in-the-center/

标签: htmlcss

解决方案


使拼写singbox正确signbox

.signbox {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -100px;
}
 <div class="signbox">
        <h2>Main Content</h2>
        <p>Other info about the site goes here</p>
 </div>


推荐阅读