0

我正在尝试将响应式媒体查询添加到主题中,而 Flexslider 正在做这个奇怪的事情,它根据媒体查询调整大小,但只显示图像的一半。

这是发生这种情况的演示:http ://www.brainbuzzmedia.com/themes/framework/

这是我在媒体查询中使用的 css:

/* Tablet Portrait size to standard 980 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 979px) {

    div#site_wrap{
        width:95%;
    }
    div#site_wrap, div.footer, div.copyright, div#title {
        width:95%;
        padding-left:0;
        padding-right:0;
    }
    div.header, div.main, #container {
        width:auto;
    }
    .footer_form textarea {
        width:90%;
    }
}

知道是什么原因造成的吗?我整晚都在做这件事。

** 我忘了提,看看我的意思是尝试调整浏览器的大小,直到它低于 980px 宽。到目前为止,768-980px 的范围是响应式的,主题的其余部分会缩小,但滑块中的图像在缩小时只显示图像的左半部分。

4

2 回答 2

0

我想到了。一旦它变得太小,搜索栏就会被撞出导航区域并落入滑块中。

于 2012-07-19T09:51:35.553 回答
0

问题出在您的 div.flex-viewport上。所有其他元素似乎都正确。然而,这个 div 在我的屏幕上停留在 433px,我不知道为什么或在哪里设置它(至少我在 Firebug 中找不到任何东西)。

我检查了我当前的 Flexslider。我没有在元素上使用 pos:rel,但其余部分是相同的,并且可以很好地从 1200-200px 缩放。

很抱歉没有更多信息。如果我偶然发现它,我会发布。

于 2012-07-19T08:52:21.583 回答