html - 防止 twitter bootstrap 垂直重新定位水平元素,直到达到一定的窗口宽度

标签 html css twitter-bootstrap

我喜欢使用 bootstrap 来提高页面的一部分的响应能力,而对于页面的顶部,我到目前为止编写的代码在将导航元素与足够大的窗口,当窗口的宽度变小时,它会将元素重新定位在彼此之上(就像它正在被手机使用一样)。

然而,问题是垂直重新定位发生得太早,或者基本上,当窗口变小但不完全是手机宽度尺寸时,这些位置过早地垂直重新定位。

这是我目前所拥有的:

 <html>
 <head>
         <meta charset="utf-8">
         <title>Walls</title>
         <link rel="stylesheet" href="http://flip.hr/css/bootstrap.min.css">
 </head>
 <body>

 <div class="container">
 <br>


    <div class="row">

    <div class="span2">

         <p>Donec </p>
         <p><a class="btn" href="#">Click meeee &raquo;</a></p>

    </div>

    <div class="span2">

         <p>Donec  </p>
         <p><a class="btn" href="#">Click meeee &raquo;</a></p>
    </div>


    <div class="span8">
    </div>


    </div><!-- .row -->
 </div><!-- .container -->

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>

 </body>
</html>

最佳答案

is there a way for me to make it so that they have a fixed position until the window gets to a certain size and then they restack vertically? that's my real goal

是的。媒体查询 ( https://developer.mozilla.org/en/docs/CSS/Media_queries ) ( http://css-tricks.com/css-media-queries/ ) 正是您要找的!它让您可以根据屏幕尺寸设置不同的规则,您可以将特定宽度设置到一个点,在该点以下您可以应用当前的 CSS 规则。

关于html - 防止 twitter bootstrap 垂直重新定位水平元素,直到达到一定的窗口宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16093149/

相关文章:

javascript - 当用户单击 MENU 按钮时滚动到带有 ID 的元素(如果其子页面也重定向到另一个页面)

html - 如何最好地在 div 内垂直居中图像和一些文本

ruby-on-rails - 在 Rails 中动态更新内容

javascript - Bootstrap 主题的模块化和可采纳性

css - Bootstrap 3 右对齐选择的输入组

javascript - 通过 element.innerText 插入不间断空间

html - 谷歌地图占据整个高度

javascript - 如何将 HTML5 桌面通知的关闭时间更改为不自动关闭?

css - 在哪里可以获得 Bootstrap 3.0 代码和文档?

css - Angular 响应式表单模板