将div宽度设置为窗口大小

Question

我有一个宽1300像素的容器.在容器内我有其他div.
我需要将内部div宽度设置为等于浏览器窗口大小,例如1900px.
内容应该响应窗口大小.

我的HTML代码如下:

<div class="container">
  <div class="content">Some style goes here </div>
</div>

CSS:

.container {
   width: 1300px;
} 

.content{
  width: 100%
}`

Answer 1

如果你有px格式的div宽度它不会响应.它必须是%格式化的.如果您将内部内容设置为width:100%内部内容将具有'.container'的宽度.
因此,为了使内部div成为窗口宽度,您应该.container使其等于窗口宽度.

CSS:

.container{
   width:100%;
}

或者如果你想我们可以使用jQuery:

 var w = $(window).width();
 $('.content').css('width', w);

Answer 2

看起来你想打开你的contentdiv作为一个模态窗口,隐藏其余的身体元素.试试这个JSBIN DEMO

.content {
  position: fixed;
  top: 0;
  left: 0;
  bottom:0;
  right:0;
}