响应式网页设计，html宽度

Question

如果您访问我的网站here，我试图让我的网站快速响应 并转到开发工具并切换设备工具栏并在响应下，如果您在900px宽度下调整窗口大小，您将看到html元素（通过整个页面）缩小到小于实际宽度的大小我的宽度设置为100％，任何想法如何解决这个问题？

如果您要查看代码，请输入以下代码：here

    html{
      width: 100%;
      }


    body{
      width: 100%;
      }

Answer 1

以下规则将起作用：

.navgiationbar ul  {
  width: 100vw;
}

但我确信有一个更清洁的解决方案。

Answer 2

我已经看过你的网站，发现更多的部分使用了像素标题h1标题的像素宽度。因此，每个使用宽度的百分比都不是像素。

您可以像这样编写标题代码并删除此类css＆＃34; .name＆＃34;并使用我的CSS：

＆＃13;

＆＃13;

.header-title {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.header-text {
	display: table;
	width: 100%;
	height: 100%;
}
.v-align {
	display: table-cell;
	vertical-align: middle;
}
.name {
	font-family: "Cookie";
	font-size: 100px;
	color: white;
	margin: 0;
	padding: 0;
}

＆＃13;

<div class="header-title">
  <div class="header-text">
    <div class="v-align">
      <h1 class="name">Robert A. Makar</h1>
    </div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;