CSS 响应式空白问题答案

【问题标题】：CSS Responsive White Space TroubleCSS 响应式空白问题
【发布时间】：2014-01-13 03:58:58
【问题描述】：

我正在设计一个带有媒体查询的网站。我开始宽度

@media screen and (min-width : 320px) and (max-width : 479px)

屏幕代码。

但是当我用手机测试时出现问题。右侧有一个空白。

我的网站是

http://zinzinzibidi.com/TurkAntivirusResponsive/Anasayfa

你可以在这里测试一下

http://www.responsinator.com/?url=zinzinzibidi.com%2FTurkAntivirusResponsive%2FAnasayfa

或这里

http://www.browserstack.com/responsive

320x480 分辨率

这是我的 CSS 代码

http://zinzinzibidi.com/Areas/TurkAntivirusResponsive/Content/css/style.css

我哪里做错了？

【问题讨论】：

对于我们这些无法或选择不加载未知第三方网站的人，能否请edit 在您的问题中附上一些关于您计算机上意外输出的截图？

标签： css responsive-design media-queries

【解决方案1】：

尝试改变：

@media screen and (max-width: 479px) and (min-width: 320px){
  #header-main {
    //early 320px , it is wrong value
    width: 300px;
    height: 400px;
    position: relative;
    float: left;
  }
}

【讨论】：

#header-container 有 #header-container { width: 300px;填充：0 10px；高度：800px；位置：相对；边距：自动； } 你看错了代码...
没有。这不会改变。早也是如此。我正在使用填充：0 10px；在其他人身上。一切都好。我使用了溢出-x：隐藏。顺便谢谢。

【解决方案2】：

然后你创建了像@media screen and (min-width : 320px) and (max-width : 479px) 这样的断点。你可以用@media screen 和 (min-width : 320px) 和 (max-width : 480px) 替换一会儿看看

【讨论】：

我没有看到代码的变化。我告诉过你 max-width: 479px 在 style.css 上替换为 max-width: 480px