如何折叠我的响应式网站上的边距答案

【问题标题】：How Do I Collapse The Margins on my Responsive Site如何折叠我的响应式网站上的边距
【发布时间】：2015-04-21 02:00:50
【问题描述】：

所以如果你去这个网址：

http://azletconsulting.com/issues/

您将看到居中的文本 div，其中包含 lorem ipsum。但是，当我减小浏览器宽度时，您会看到右边距只会塌陷，将文本 div 的边缘推入右侧。我缺少什么 CSS 代码，以便 DIV 的外边距折叠同样保持文本 div 居中，而不是仅仅压碎右侧？这几乎适用于网站上的每个 DIV，但文本是最引人注目的。

谢谢巴罗蒂

【问题讨论】：

基本上这就是我希望在浏览器宽度发生变化时发生的事情，我只是无法弄清楚在我当前的 CSS 代码中是什么破坏了它。 jsfiddle.net/LHCbk
我实际上认为问题更多在于文本下方的按钮。文本 div 现在在将其显示为块后保持其边距，边距：0 auto;但按钮拒绝调整自己以保持自己在文本 div 下对齐。

标签： html css responsive-design

【解决方案1】：

您在“.issues_nav”中以% 的形式写入了margin-left，它正在推动元素。如果你想让元素居中，最好使用它。

margin-left:auto;margin-right:auto;display:block

【讨论】：

我在本地构建中更改了此设置，但与左侧相比，它仍然只是在文本 div 的右侧不均等地折叠右边距。我只希望 div 的左右两侧同样折叠，同时保持 80% 的纵横比，直到它到达下一个媒体查询。