James Dickens James Dickens - 3 months ago 8
CSS Question

Inner Div with larger width than outer div

Suppose I have an Outer Div with a size:1200px, and within this div that I wanted to have an Inner Div that is wider, just for the purpose of fitting more horizontal stuff into a window.

As of right now the following CSS is not achieving this. Any tips appreciated.



.OuterDiv {
width: 1200px;
}
.InnerDiv {
width: 1400px;
}

<div class="OuterDiv">
<div class="InnerDiv"></div>
</div>




Answer

Try this. I added height and background so you could see the boxes.

The key is overflow: auto

.OuterDiv {
  width: 200px;
  height: 140px;
  background: blue;
  overflow: auto;
}
.InnerDiv {
  width: 1400px;
  height: 90%;
  background: orange;
}
<div class="OuterDiv">
  <div class="InnerDiv"></div>
</div>

Comments