1

嗨,我正在使用引导响应 CSS 编写静态网页,并且在调整窗口大小时遇到​​问题。

当我调整屏幕大小时,此部分会消失:

<div class="span9 nav">
                <h1><span class="logo"><em>Academia</em> <b>GEO</b></span></h1>
                <ul>
                    <li><a href="#details"><img src="img/icons/mail.png"></a></li>
                    <li><a href="#details"><img src="img/icons/phone.png"></a></li>
                    <li><a href="https://www.facebook.com/pages/Academia-GEO/570581836324054" target="_blank"><img src="img/icons/fb.png"></a></li>
                </ul>
            </div>

我不知道为什么 div 没有按预期正确调整大小。

这是页面:

http://209.141.57.95/

正如您在使用小屏幕时看到的那样,页面顶部的蓝色 div 消失了,内容显示在白色主体中。

知道为什么会这样吗?问候

4

3 回答 3

4

只需将“clearfix”的内置引导样式添加到您的跨度中:

<div class="span9 nav clearfix">

这将解决它。

于 2013-11-05T14:22:38.340 回答
2

这是一个clearfix问题;因为 div 中的所有元素都是浮动的,所以 div 会向下折叠,因此它没有高度。

这可以像这样轻松修复:

<div class="span9 nav">
                <h1><span class="logo"><em>Academia</em> <b>GEO</b></span></h1>
                <ul>
                    <li><a href="#details"><img src="img/icons/mail.png"></a></li>
                    <li><a href="#details"><img src="img/icons/phone.png"></a></li>
                    <li><a href="https://www.facebook.com/pages/Academia-GEO/570581836324054" target="_blank"><img src="img/icons/fb.png"></a></li>
                </ul>
                <div style="clear: both;"></div>
</div>
于 2013-11-05T14:19:56.640 回答
-1

<div style="clear: both;"></div>有点为我工作,但真正的问题是我应该有 col-xl 而不是 col-sm 或 col-md。杜普。

于 2015-01-30T21:20:31.240 回答