左对齐div不以某些页面大小为中心

Question

相关网页的示例：https://rhstrategic.staging.wpengine.com/team/brandon-blackwell/

我有一种具体情况，其中我有一个块div，它保持左对齐，当屏幕大小低于960px时只使用50％宽度（顶部红色横幅部分中的名称块） 。我尝试改变CSS以使宽度为100％，但问题是高度似乎是用宽度动态生成的（如果我将div宽度增加到100％，则高度加倍）。

我无法弄清楚如何分离高度和宽度，而且我不知道这些CSS更改的动态生成位置。它看起来有点像HTML5数据对象，但我对这些类型的东西有点新，所以我不确定如何更改它。当它降到650px时，它似乎表现得像我想要的那样。但是在650-960px之间它是左对齐的。

我需要做的就是当页面下降到960px或更低时，我需要当前左对齐的部分在页面上全宽并居中。有什么想法吗？

Answer 1

只是一个警告：我不是100％确定这个答案能正常工作......我的想法是把这个风格放在div中： div{ width:100%; height:50%; }

Answer 2

我想建议一些事情：

1. 如果您不熟悉前端设计，我建议您了解HTML页面的网格系统。学习Bootstrap将是一个完美的开始。
2. 现在你想让你的网站流畅，所以看看CSS media query。这将有助于您实现响应能力。

快乐编码..