title: CSS: How to position a div in the center with dynamic width
body: <p>I have a popup which is positioned in the center of the screen with: <code>transform: translate(-50%, -50%);</code> and <code>position: absolute</code>. Unfortunately for some reason my width is fixed and it is not dynamic ( based on the content ).</p>
  
  <p>This is my jsfiddle: <a href="https://jsfiddle.net/qh13mnaf/1/" rel="nofollow">https://jsfiddle.net/qh13mnaf/1/</a></p>
  
  <p>Why the width of the popup is not bigger? </p>