个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
25
4
我正在使用 Bootstrap 构建响应式设计。现在我想创建一个简单的响应式页脚导航。其实事实证明并没有那么简单。我目前面临一个问题，并希望实现一项改进。
问题
一旦导航点开始堆叠，导航点的填充就会重叠，但它们不应重叠。我已经在网络上做了一些研究并尝试了不同的方法，但到目前为止没有一个对我有用。
改进
导航点应在移动 View 中堆叠，但应与更大的视口(viewport)尺寸保持一致。我的感觉是，实现此功能请求也将解决上述问题。但我不确定如何正确设置 Bootstrap 。
也许更有经验的开发人员可以建议如何归档该目标。
我还创建了一个可用的 jsfiddle 示例
<!DOCTYPE html> <!-- Bootstrap uses HTML5 elements and CSS3 properties -->
<meta charset="utf-8">
<!-- Enable IE compatibility mode. -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Scales the viewport width and height to the max. browser window -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<body>
<div class="container">
<div class="row">
<div class="col-sm-12">
<ul id="footer--navigation">
<li><a href="#">Test-Category</a></li>
<li><a href="#">Test-Category</a></li>
<li><a href="#">Test-Category</a></li>
<li><a href="#">Test-Category</a></li>
<li><a href="#">Test-Category</a></li>
</ul>
</div>
</div>
</div>
</body>
https://jsfiddle.net/herbert_hinterberger/y6kcgkbe/1/
非常感谢。赫伯特
最佳答案
如果我对你的问题的理解正确，那么你只需要添加 display: inline-block 到你的页脚链接:
#footer--navigation li > a {
display: inline-block;
padding: 15px;
text-decoration: none;
text-transform: uppercase;
}
否则，将不会应用链接的顶部和底部填充
关于html - Bootstrap : Navigation points should stack in mobile view and padding inside navigation points should not overlap，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31240574/
25
4
0
所以我正在做一个Java作业，我必须创建一个矩形类，该类在一个绘制重叠矩形的程序中使用，并且在矩形重叠的地方，用新的颜色绘制一个新的矩形。我添加了硬件描述的链接，因为我认为让您查看它比我试图解释它更容
如何将两个重叠的 div 加上第三个 div 放在那些重叠的 div 的右侧(但第三个 div 没有一直 float )？ I overlap id=two. I overlap id=one. I
我需要你的帮助，我有一个问题(见图)，我假设有两个数组，每个数组都包含不同长度和实际值的间隔，我需要找出我如何有效地重叠这些间隔。 我对想法、论文理论或具体算法持开放态度，它们会让我找到出路! 我猜想
尝试编写一个从聚合数据返回气泡图的函数。 我将“agg”中的 data.frame 列传递给它。 aggs2 9) } ##order data.frame by mean agg1 <
我正在使用 d3.js 以这种方式生成一些直接位于彼此上方的矩形: var greenRed = d3.select(".green-red").append("svg") .attr("he
我正在尝试创建一个库，它提供一个简单的链表实现以及该链表的一些概括，例如堆栈和队列，所有这些都基于基本链表。 问题是，我希望拥有具有自己的“私有(private)”函数的不同类型，这样您就不会使用“s
我使用 AJAX 和 JQuery 从 MySQL 数据库中提取数据，基本上使用以下内容: function getCard(card, lineNr, linedisplay, type){ var
如何在 SQL OVERLAPS 中包含开始日期和结束日期？ 喜欢=。怎么办？ 因为在我看来 OVERLAPS 只检查两者之间的范围，但是例如: 日期 2001 年 1 月 1 日 - 2001 年
我在使用在 Google Web Fonts 上找到的字体时遇到了一些问题. 正如您在下面发布的图片中看到的，当我使用 Firefox 时，“Versus”中的大写 V 与“e”重叠。尽管当我使用 C
题目地址：https://leetcode.com/problems/image-overlap/description/ 题目描述 Twoimages A and B are given, re
题目地址：https://leetcode.com/problems/rectangle-overlap/description/ 题目描述： Arectangle is represented
在我们的测试环境中，我们的 solr 搜索引擎一直存在许多问题。我们在 4.6 版、单分片、4 个节点上有一个 solr 云设置。我们看到领导节点上的 CPU 水平线达到 100% 几个小时，然后服务
我正在做一个 excel 任务，我必须找出是否有重叠的日期。 在我的 excel 工作表中有 startDate(column D) 和 EndDate(comun E) 的列，由此我必须确定是否存在
在这张图片中，一个全景项目的内容渗透到前一个项目上: 如何在 Expression Blend/with XAML 中执行此操作？ 这是我目前的 XAML:
我已经以编程方式创建了一个 iPhone UI，但我只是不知道如何调整 View ，以免它被 TabBar 重叠。这是所有权层次结构: -AppDelegate UITabBarController
我正在使用 wxMaxima 16.12.0 (Maxima 5.39.0)，当我尝试打印输出时，出现重叠文本。 这是一个例子(请忽略命令不正确的事实) 第一张图片 有时也会发生在 print和 pr
我尝试为 javascript 添加一些语法高亮到 vim，但我一直遇到一个问题:当字符已经高亮时，它们似乎被所有其他正则表达式完全忽略。 例如，我尝试为函数的参数列表添加语法高亮显示。在创建正确的
我有五个 ImageView(ImageButton)，我想将其显示在一行上，但是当我在小型设备上时，我的最后一个图像被裁剪了？ 我该如何修复它？ 有没有办法检测屏幕宽度？ |一个 |乙| C | d
我尝试为 javascript 添加一些语法高亮到 vim，但我一直遇到一个问题:当字符已经高亮时，它们似乎被所有其他正则表达式完全忽略。 例如，我尝试为函数的参数列表添加语法高亮显示。在创建正确的
我将用数学解释，这是我正在努力为以下内容编写 Scheme 代码的转换: (f '(a b c) '(d e f)) = '(ad (+ bd ae) (+ cd be af) (+ ce bf) c
我是一名优秀的程序员,十分优秀！