2

我在 Bootstrap 3 中尝试复制 getbootstrap 站点上使用的垂直导航栏。我遇到了几个问题,但我没有找到很多文档可供使用。

这是一个引导链接,向您展示我来自哪里:http: //bootply.com/77832

问题 1 是,如果我将屏幕尺寸从大更改为小,我的导航现在位于我的文本下方。但在引导站点上,导航移动到屏幕顶部,文本位于其下方。如何修复它的响应性,以便在小屏幕上调整大小或查看它不会破坏布局?

第 2 期是化妆品。我希望导航上漂亮的粉红色背景填充整个容器,而不仅仅是文本的宽度。所以我想,嘿,给那个坏男孩一个宽度:100%,你就准备好了。我以为它会填充 100% 的 col-md-3 包含它,但它实际上填充了 100% 的屏幕宽度。为什么它会延伸到它所在的 col-md-3 之外,我怎样才能获得所需的外观?

4

1 回答 1

1

对于#2,问题在于 UL 有一个 position:fixed,所以它有点“移除”自己不知道其父级的宽度。基本上,它将正文视为父级,因此 width: 100% 将使其与页面一样宽。

对于#1,您可能希望查看,当页面变小时,将导航“不附加”到页面的一侧。

于 2013-08-29T17:35:41.040 回答