JS Fiddle：使div占据100％的高度答案

【问题标题】：JS Fiddle: Making div occupy 100% heightJS Fiddle：使div占据100％的高度
【发布时间】：2015-06-14 19:37:57
【问题描述】：

我正准备提琴问另一个问题，但在提琴时偶然发现了另一个问题。

这是fiddle 的链接。

HTML 代码：

<div class="outer-container">
            <div class="inner-container">
                <div class="slider-one slide" style="background-image:url('http://208.131.135.54/~imacre17/wp-content/uploads/2015/03/homeslide1a.png'); height: 100%; background-size: cover;" class="slider-background-image' ">
                    <div class="slide-inner-container">

                        <div class="clearfix"></div>
                    </div><!-- /.slide-inner-container -->
                </div><!-- /.slide -->
                <div class="slider-one slide" style="background-image:url('http://208.131.135.54/~imacre17/wp-content/uploads/2015/02/2-Home-membership.jpg'); height: 100%; background-size: cover;" class="slider-background-image' ">
                    <div class="slide-inner-container">
                        <!-- More content here soon -->
                    </div><!-- /.slide-inner-container -->
                </div><!-- /.slide -->
                <div class="slider-one slide" style="background-image:url('http://208.131.135.54/~imacre17/wp-content/uploads/2015/02/2-Home-special-events.jpg'); height: 100%; background-size: cover;" class="slider-background-image' ">
                    <div class="slide-inner-container">
                        <!-- More content here soon -->
                    </div><!-- /.slide-inner-container -->
                </div><!-- /.slide -->
                <div class="slider-one slide" style="background-image:url('http://208.131.135.54/~imacre17/wp-content/uploads/2015/03/CORKHome-_position4.jpg'); height: 100%; background-size: cover;" class="slider-background-image' ">
                    <div class="slide-inner-container">
                        <!-- More content here soon -->
                    </div><!-- /.slide-inner-container -->
                </div><!-- /.slide -->


            </div><!-- /.inner-container -->
        </div><!-- /.outer-container -->

有 4 个 .slide 类的 div，每个 div 都有一个作为内联样式添加到它的背景图像。每个 div 还应用了 100% 的高度。

如果我在 HTML 页面中应用相同的样式，一切都很好，这里是 link。如何让 div 占据 100% 的高度。

【问题讨论】：

那么您的问题是什么？它没有响应？请解释发生了什么以及您需要解决什么？ @chandan
你的问题是？？
@AndrewLyndem：在标题中，使 div 拉伸 100% 高度。感谢您的反对票。
@Chandan 我没有对此投反对票。我刚刚问了问题是什么。

标签： jquery html css jsfiddle

【解决方案1】：

您可以将position:fixed; height:100%;添加到幻灯片类

【讨论】：

@Gary：谢谢你的回答，但这不是问题，我的 jquery 代码错了。
@chandan 这是 Abdollah 的回答，我刚刚编辑了格式
@Gary：对不起，这个问题发生了奇怪的事情，有人给我的答案是我的 jquery 是错误的，但不久他们删除了它。

【解决方案2】：

我的 jquery 代码错误：

这段代码：

var viewportWidth = $(window).width();
var viewportHeight = $(window).height();

$("*").css({"width": viewportWidth, "height": viewportHeight});

解决了这个问题。

【讨论】：