0

因为我是 Bootstrap 的新手，并且在需要嵌套列布局的测试站点上工作。我的代码如下

            <html class="no-js" lang="en-US">
                <body>
                <div class="container">
                <div id="page" class="row">

            <header id="branding" role="banner" class="span12">
                <nav id="access" role="navigation">
                Menu 
                </nav>
                </header>

            <section id="primary" class="span9">
            <div id="content" role="main">
                <h1 class="entry-title">Some Title</h1> 
                <div class="entry-meta">
                Some Info
            </div><!-- .entry-meta -->

            <div class="row meta-info">

            <div class="post-image span3">
                <ul class="thumbnails">
                image
                </ul>
            </div><!-- .post-image -->

            <div class="post-intro span4">
                some intro text
            </div><!-- .post-intro -->

            <div class="post-desc span2">
                some more info
            </div><!-- .post-desc-->

            </div><!-- meta info-->


            </section>
            </div><!-- #content -->

            </div><!-- row -->
            </div><!-- container -->
            </body>
            </html>

我看到每个人都认为在大显示器上没问题，但是在 1152x864 的屏幕上，span2 上的 post-desc 会崩溃并出现在 span4 的底部。

我需要的是它应该保持响应，并且应该随着浏览器的重新大小而调整。

我的代码正确吗？还是有其他方法可以实现这一目标？

请帮忙。

问候 SAQ

4

1 回答 1

0 
 <div class="row meta-info">

应该是

 <div class="row-fluid meta-info">

假设您的容器上有一个 max-width 值，它应该可以工作。

于 2013-04-08T10:14:33.693 回答