在没有位置的页面底部设置底部导航栏菜单:固定(引导程序，css3) [英] Set bottom navbar menu on the bottom of the page without a position:fixed (bootstrap, css3)
问题描述
我想更改我的 css，以便页面底部菜单保留在那里(如固定)，但没有位置:固定.
为什么?
确实，使用 Boostrap 3，我使用的是 navbar-fixed-bottom .
BUT position:fixed 完全不支持 Opera Mini 占 10几乎所有移动浏览器的百分比(请参阅此处).
如何在没有 position:fixed 的情况下创建它?
3 个约束:
我从不想要任何滚动:这意味着如果视口变小(无论视口的大小:大、小、桌面、平板电脑...)，菜单和图像只会变小，永远不会任何水平或垂直滚动条.
并且我希望菜单保持在图像下方(图像的质量，无论是否失真，不是我在这个问题中的重点).
我只想要 html 和 css:没有 javascript 和 jquery.谢谢
这是我想做的一个例子:
这是我当前使用固定位置的代码:
<nav role="navigation" class="navbar navbar-default navbar-fixed-bottom"><div class="容器"><!-- 标题--><div class="navbar-bottom pull-left"><a href="/" class="navbar-brand">BIGGA</a><!-- navbar-LEFT 上的非折叠项目--><div class="collapse navbar-collapse navbar-left"><!-- pull-right 使下拉菜单保持一致--><ul class="nav navbar-nav pull-right"><li><a href="/news">新闻</a>
<!-- 'Sticky'(非折叠)右侧菜单项--><div class="navbar-bottom pull-right"><ul class="nav pull-left"><!-- 这适用于静态文本，如用户名 --><li class="navbar-text pull-left">用户名</li><!-- 添加任何额外的引导程序头项.这是一个图标的下拉菜单 --><li class="dropup pull-right"><a href="#" data-toggle="dropdown" style="color:#777; margin-top: 5px;"class="dropdow-toggle"><span class="glyphicon glyphicon-user"></span><b class="caret"></b></a><ul class="下拉菜单"><li><a href="/users/id" title="个人资料">个人资料</a><li><a href="/logout" title="退出">退出 </a><!-- 折叠菜单所需的引导程序占位符 --><button type="button" data-toggle="collapse" data-target=".navbar-collapse" class="navbar-toggle"><span class="sr-only">切换导航</span><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></跨度>
<!-- 上方 PULL-RIGHT 内容左侧的附加导航栏项目--><div class="collapse navbar-collapse navbar-right"><!-- pull-right 使下拉菜单保持一致--><ul class="nav navbar-nav pull-right"><li><a href="/locator">Locator</a><li><a href="/extras">Extras</a>