Question

This is the website, and more specifically, the page

我目前正在开发一个响应式主题，它有媒体查询，但我做过的CSS修改，正在阻止菜单（黄金右上角）和侧边栏（这只存在于博客上）页面，但重要的是...它是内容块右侧的框）与标题/标题/左手内容合并。它出现在ipad mini，常规ipad 4上，但它在Android浏览器屏幕上还可以。您可以通过调整浏览器大小来观察问题。

@media only screen and (min-width:768px) {
.site-navigation .nav-menu {
 display: block;
}
}@media only screen and (max-width:767px) {
.menu-toggle {
display: block;
}
}@media only screen and (min-width:768px) and (max-width:959px) {
.wrap {
max-width: 728px;
}

那是媒体屏幕css。各个div都是相对定位的。有没有人对如何解决这个问题有什么建议？任何代码花絮？

Answer 1

我看到的第一件事是这个HTML没有关闭：

 <div id="header" onclick="location.href='http://camillagabrieli.com

需要先修复。尝试在CSS中添加大纲：

* { outline: 1px dashed black }

我发现在查看不同浮动元素的实际错误时会有很大帮助。您的安排和CSS有很多问题。你不需要相对定位所有这些东西。

修复主要内容部分：

将以下内容添加到#main：

overflow:hidden;

按照以下方式制作#content和＃sidebar-primary：

#content {
    float: left;
    width: 75%;
    margin-left: 40px;
    margin-right: 10px;
    margin-top: 10px;
    min-height: 50px;
}

#sidebar-primary {
    float: left;
    width: 20%;
    border-top: 1px solid #222;
    border-bottom: 1px solid #222;
    height: 50%;
}

我不确定为什么你有保证金最高价：-460px;在你的代码中，但这就是破坏它的事实，因为#main实际上并不包含#content和＃sidebar-primary。代码仍然需要清理，但这会立即修复它。

这有帮助吗？

媒体查询以保持菜单和侧边栏与标题/正文合并

1 个答案: