Question

所以这是我的网站两周前的网站直播。

我遇到的问题是，当调整浏览器窗口大小并且我试图修复此问题时，右侧和我的导航栏上的ax按钮与其余元素分开移动。我要么都要修复它们，要么在调整浏览器大小时让它们一起移动。

我一直在网上看，无法解决这个问题。如果我尝试将它们全部放在一个块中，那么一切都会被抛出，而且我的按钮不再可以点击了。

我是css和html的新手。但是我想在这里学习并弄清楚我做错了什么。任何帮助将受到高度赞赏。谢谢。

Answer 1

如评论中所述，移动的元素要么使用相对于其容器的百分比放置，要么浮动，例如斧头，将其固定在右侧并随着该侧移动而移动。

中心div不移动，因为它处于固定位置。如果你想要扩展和折叠以便为其他元素腾出空间，那么你必须以宽松的百分比而不是px值。

现在情况开始变得复杂，因为中心div的内容最终会缩小并堆叠在彼此之上。因此，流畅/响应式网络开发的问题，但也使你的问题有点过于宽泛，无法完全回答。

Answer 2

CSS定位是一个强大的工具，但不应该以这种方式使用。重新排序HTML，这样您就不需要绝对定位所有内容。然后使用边距正确定位斧头按钮。

我建议如下：

HTML：

   <nav>  
   <leftaxe>
   <rightaxe>
   <box>

CSS：

/* remove position:absolute and left, right, top, bottom styles */
.leftaxe, .rightaxe { margin:302px auto 0; }

可能会进行其他CSS调整，但这可以让您更好地进行调整。快乐的编码。