title: Make padding responsive
body: <p>I just started using Bootstrap, and I'm new in front-end development in general. I'm having a problem with padding, since it remains the same size in desktop and mobile devices.</p>
  
  <p>HTML code:</p>
  
  <pre><code>  &lt;div class="container" id="i-container"&gt;
          &lt;h3&gt;We possess high quality products &amp;mdash; therefore our customers are always loyal&lt;/h3&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>CSS code:</p>
  
  <pre><code>  #i-container{
          border: solid;
          border-color: rosybrown;
          padding-left: 150px
          padding-top: 10px;
      }
  </code></pre>
  
  <p>As I mentioned above, in mobile devices the padding remains the same (it doesn't seem to be responsive). I tried using <em>em</em> too, by the way. It doesn't help either.</p>