- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
我正在尝试使用 Bootstrap Grid 制作侧边栏,但我希望它一直延伸到底部。 Image of what I am trying to accomplish.
我不想破坏响应能力并尽可能避免使用 Javascript 解决方案。
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<style>
/* Footer CSS */
html {
position: relative;
min-height: 100%;
}
body {
margin-bottom: 60px;
}
.footer {
position: absolute;
bottom: 0;
width: 100%;
height: 60px;
background-color: #3e8f3e;
}
</style>
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-md-10" style="background-color: #f5e79e">
Column that does not need to stretch
</div>
<div class="col-md-2" style="background-color: #ffff00;">
Sidebar/column to stretch down to the bottom (to the footer)
</div>
</div>
</div>
<footer class="footer">
<div class="container-fluid">
<h5>Footer to reach down too</h5>
</div>
</footer>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
</html>
代码也可以在 jsfiddle.net 上找到这可能会更容易使用。确保你拖动结果,这样网站就不会显示列在彼此下方的移动版本。
感谢任何帮助,因为我多年来一直坚持这个问题。
最佳答案
我有两个选择:
如果你喜欢带有网格的侧边栏,那么在 flex 布局中使用 .container-table
使用 bootstrap-essentials : jsfiddle.net/grvpanchal/1k1wdu8u
如果你想要一个响应式侧边栏 .navmenu
就像使用这个:jsfiddle.net/grvpanchal/g6kxjxuo
关于javascript - 如何使 Bootstrap 网格列成为页面的全高?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41840753/
我正在学习 Go,但我无法在任何地方找到这个答案。 Web开发中的文件扩展名是否有任何官方标准?我见过多种约定,例如 .tmpl 和 .gtpl,这是什么?谢谢。 最佳答案 没有固定的标准,但有一些相
关闭。这个问题是opinion-based .它目前不接受答案。 想改善这个问题吗?更新问题,以便可以通过 editing this post 用事实和引文回答问题. 8 年前关闭。 Improve
假设我有两个类(class) Widget ^ | Window 我还有另一个类应用程序: 定义如下 class Application { public: ... private:
按照目前的情况,这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visit the
我多年来一直在使用 MySQL,直到去年左右,主要是在较小的项目上。我不确定是语言的性质还是我缺乏真正的教程让我不确定我正在写的东西是否是优化目的和扩展目的的正确方法。 虽然自学 PHP,但我对自己和
我已经多次读到 EJB 是重量级的……但昨晚我正在浏览关于 EJB 的 Java EE 6 教程,它们似乎只是普通的 Java 对象,除了它们可以有像 Stateless 或 Singletons 这
如何使此 SimpleModal 脚本在页面加载时加载而不是单击按钮?谢谢=) Demo 基本模态对话框 对于此演示,SimpleModal 使用此“隐藏”数据作为其内容。您还可以使用标准 HTML
这是 Haskell 中的代码: class Fooable a where foo :: a -> a instance Fooable (a, a) where foo = ...
是否有推荐的方法来测试 Actor 是否使用 be 正确改变了其行为?我更喜欢使用 FSM 的原因之一是因为我可以轻松验证 Actor 是否已更改其行为。我不知道在使用 become/unbecome
我正在构建一个位于“php my admin”中的表,我是在第一次点击其中一个“th”它的 asc 时这样做的,现在我试图在第二次点击时制作 desc ..有什么想法吗? 阿姆..很多我不记得了抱歉.
考虑以下网页。 我在 Firefox 中打开此页面,打开 JS 控制台并键入以下内容。 > document.getElementById(
如何让自己成为 postgresql 的 super 用户? 我一直在尝试创建数据库,但我不断收到以下错误: createdb: database creation failed: ERROR: pe
Query没有太大帮助。 如前所述here , PostgreSQL 是 ORDBMS。 here ,它解释了 PostgreSQL 是 RDBMS。 PostgreSQL 是一个 ORDBMS 是什
我已经看到,当在导航元素中使用的链接中垂直/水平居中文本时,将链接设置为 flex 容器会很有用。我没有意识到链接文本实际上可以是一个(单个) flex 元素。我可以看到链接中的 span 元素可以是
我见过很多说明如何找到给定集合的子集的示例,但是您如何将一个集合设为另一个集合的子集?所以集合 B 是集合 A 的子集,这将如何实现?我目前正在使用递归性质的方案,但是这本书只展示了如何列出子集而不是
有些程序会根据其标准输出是否为 tty 来更改其输出。因此,如果您将它们放入管道或重定向它们,输出将与您的 shell 中的不同。这是一个例子: $ touch a b c # when runnin
我正处于项目的开始阶段,到目前为止我一直在使用默认的 MySQL 数据库。 对了,默认的数据库有名字吗? 我的问题是如何在不删除当前表和创建新表的情况下将现有表更改为 utf-8 和 InnoDB。是
我正在尝试编写一个过滤器来包装数据以遵循 JSON API spec到目前为止,它适用于我直接返回 ActionResult 的所有情况,例如 ComplexTypeJSON。我试图让它在像 Comp
我在 Storyboard 上创建了一个带有一个 UITextField 的自定义 UIViewController。在 viewDidLoad 上,我将 UITextFIeld 设置为 become
我已经看到关于 valueless_by_exception 方法的 cppreference 的以下注释: A variant may become valueless in the followi
我是一名优秀的程序员,十分优秀!