title: Lock vertical scroll
body: <p>I have an image that I need it to scroll horizontally (due to responsive menu that moves content to the left ) 
  and fixed vertically (the logo is always fixed vertically).<br></p>
  
  <p>I want to lock vertical scroll, but let scroll horizontal work.</p>
  
  <p>I want something like this,</p>
  
  <pre><code>vertical.position:fixed
  horizontal.position:relative
  </code></pre>
  
  <p>But if it isn't possible, I would like to know if it's possible o make a reach box for the logo.<br>
  I've already tried overflows and positions...<br>
  Thank you</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="site-wrap"&gt;
      &lt;div id="bar"&gt;
          &lt;div id="baar"&gt;
              &lt;img src="images/logo2.png" alt="logo2" width="124" height="56" /&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>#bar {
       height: 88px;
       width: 100%;
       position: relative;
       top: 0;
       left: auto;
       z-index:2;
       float: right;
   }
   #baar {
       height: 56px;
       width: 100%;
       background: linear-gradient(top, #e3e3e3 0%, #f9f9f9 100%);
       background: -moz-linear-gradient(top, #e3e3e3 0%, #f9f9f9 100%);
       background: -webkit-linear-gradient(top, #e3e3e3 0%, #f9f9f9 100%);
       background-image: -ms-linear-gradient(top left, #e3e3e3 0%, #f9f9f9 100%);
       background-image: -o-linear-gradient(top left, #e3e3e3 0%, #f9f9f9 100%);
       background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #f9f9f9), color-stop(1, #e3e3e3));
       background-image: linear-gradient(to bottom right, #e3e3e3 0%, #f9f9f9 100%);
       box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.15);
       box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.15);
       position: relative;
       overflow-y: inherit;
       left: auto;
       text-align: center;
       margin-top: 16px;
       top:0;
   }
   .site-wrap {
       min-width: 100%;
       min-height: 100%;
       background-image: url(images/pat3.png), url(images/pat.gif);
       background-size: 100% 100%, auto;
       position: relative;
       top: -18;
       bottom: 100%;
       left: 0;
       z-index: 1;
   }
  </code></pre>