title: Collapsible Margins HTML/CSS
body: <p>I have my subject matter here taking up 50% of the screen width, which leaves a nice margin on larger screens. However on smaller screens, this takes up valuable screen space. Is it possible to have the margin "collapse" in order to preserve the subject matters width? Or possibly give a range of acceptable widths? Basically I want the margin to shrink, prior to the subject matter shrinking. </p>
  
  <pre><code>&lt;!doctype html&gt;
  
  &lt;html&gt;
  
    &lt;head&gt;
    &lt;/head&gt;
  
    &lt;body style="margin-left:auto; margin-right:auto; width:50%;"&gt;
  
      &lt;p style="height:100%; background:#878787;"&gt;some text&lt;/p&gt;
  
    &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>