我喜欢使用 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 »</a></p>
</div>
<div class="span2">
<p>Donec </p>
<p><a class="btn" href="#">Click meeee »</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/