Set div width equal to window size

user_1776510 0
Viewed 124259

I have a container of width 1300 px. Inside the container i have other div.
I need to set the inner div width equal to browser window size eg) 1900px.
The content should be responsive to the window size.

My html code is like below: 

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

Css: 

.container {
   width: 1300px;
} 

.content{
  width: 100%
}`
css width html
6 Answers

remove default(bootstrap) max-width of container and set content width to 100%

.content{
      width: 100%;
}

.contianer{
       max-width: none; 
}
user_136575120

You can set the width of the .content (child div) equal (100%) to the browser window size instead of equal (100%) to the .container size (father div):

.container {
   width: 1300px;
} 

.content{
  width: 100vw;
}

1vw is 1% of the width of the viewport

user_50928590
Related