Element Nesting & Overflow

Control Nested Element Styles and Overflow

HTML

<div class="outer" id="page">
    
    <div class="inner"></div>
    
</div>

CSS

/* this is a comment */
page {
  width:  50%; /*measure in percent*/
  height: 100px; /*measure in pixel*/
  /*margin: 20px;*/
  margin-bottom: 20px;
  background: gray;
}

.outer {
    background: blue;
    overflow-x: scroll;
    overflow-y: hidden;
}

.inner {
    background: yellow; 
    width: 150%;
    margin: 0;
}