title: Irregular Div shape Distort one corner only
body: <p>How would i create a div shape like this? I have read a lot of techniques but i could not figure this one out. Inside the div is text that should not be distorted.</p>
  
  <p>Every technique is welcome it does not have to be pure css.</p>
  
  <p>My HTML structure:</p>
  
  <pre><code>&lt;div class="intro"&gt;
                  &lt;div class="intro-header"&gt;
                      &lt;h1&gt;Headline WOW&lt;/h1&gt;
                  &lt;/div&gt;
                  &lt;div class="intro-text"&gt;
                      &lt;p&gt;Mieleni minun tekevi, aivoni ajattelevi lähteäni laulamahan, saa'ani sanelemasaa'ani sanelema sanelemasaa'ani sanelema &lt;/p&gt;
                  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/Uu0Tq.png" alt="enter image description here"></p>