title: How to implement min left/right in css
body: <p>I have an element in my css which look like below</p>
  
  <pre><code>.xyz{
      position:absolute;
      left:50%;
      }
  </code></pre>
  
  <p>Now as expected when I reduce the width of browser window, this element moves towards left. However I want it to stop at a certain point since otherwise it starts overlapping other elements. In principle, this is very similar to min-height and and min-width properties. But there is no such property like min-left or min-top. How can I implement this.</p>