title: How to make a fluid width email with a max width
body: <p>I have a table element which I'm going to send as an email.</p>
  
  <p>I want it to render on outlook 2010, gmail native for android, and gmail on chrome on android.</p>
  
  <p>I would like my table to have 100% width upto 600px.</p>
  
  <p>One solution would be do  with fixed settings, and have media queries.</p>
  
  <pre><code>@media screen and (max-width: 600px) {
  
      table[class="responsive-table"] {
          width: 100% !important;
      }
  }
  </code></pre>
  
  <p>This works fine in all but gmail on chrome on android, which takes the 600px width and overflows the screen, breaking the whole layout.</p>
  
  <p>So I thought about doing a fluid layout, and putting 100% to the table, and giving it a max-width, but now outlook does not respect max-width, so it looks too wide in outlook.</p>
  
  <p>So I can't use fluid because it looks bad on outlook, and I can't use fixed because it looks bad on gmail on chrome on mobile.</p>
  
  <p>Is there any way I can make the look ok in both? Is there any hack for this? </p>