具有可移动内容的响应式固定标题和滑块

时间:2016-02-19 19:53:24

标签: css twitter-bootstrap css3 responsive-design liferay-6

对于初学者的问题感到抱歉,但我在响应式网页设计方面的经验相当有限。

我正在创建一个门户网站主题,该主题应包含以下元素

-HEADER (Fixed)
-Image Slider (Fixed, just beneath the Header)
-Portal Content (Movable, position relative)

我已设法修复标题和图像滑块。我想到的唯一方法是将门户网站内容显示在图片滑块的下方,即设置

padding-top: 300px;
position: relative;

我遇到的问题是,当我缩小窗口时,占据页面100%的图像滑块会失去高度。这是因为它保持了所显示图像的宽高比。

由于我设置了一个绝对填充,我的门户内容和我的滑块之间的差距越来越大,窗口越小(因为图像滑块失去高度)。

有没有办法让相对门户网站内容出现在固定图片滑块下?

1 个答案:

答案 0 :(得分:0)

我通过使标题相对位置来修复它。 所以没有更多的固定标题...;)

无论如何它占用了很多空间...