title: Website with nested tables structure: How to remove padding and margin only for the main structure and not for a table inside?
body: <p>I am working on a website that uses tables for the structure and it is impossible to have access to them and replace then with divs. I have looked at using jquery to remove and replace these tables but for now it would be the last solution...if it was even possible</p>
  
  <p>They come with a default styling that is also not accessible (with padding and margin)</p>
  
  <p>I also use foundation 5 for this project on Netsuite so i am overwriting 2 style sheets.</p>
  
  <p>I am using this CSS to strip the margin and padding from the table that comes with the foundation.css</p>
  
  <pre><code>   table, tr, td, table, table tr.even, table tr.alt, table tr:nth-of-type(even), table, table tr.odd, table tr.alt, table tr:nth-of-type(odd) {
      padding: 0px !important;
      margin: 0px !important;
  }
  </code></pre>
  
  <p>It basically does a good job but i do need to get more specific because the shopping cart uses also tables and it strips all margins and padding and it is impossible to add them afterwards as it won't take them.</p>
  
  <p>Here is the website main body structure that i would need to remove the margin and padding but i would like it to stop at the last table structure to allow me to style the content inside that would use tables.</p>
  
  <p>Thanks for your helps! I hope i was clear enough ;)</p>
  
  <pre><code>&lt;div id='div__body' style="margin: 0px;  margin-top: 3px;"&gt;
      &lt;table border='0' cellspacing='0' cellpadding='0' width='100%' id='__enclosingtable'&gt;
          &lt;tr&gt;
              &lt;td valign="top"&gt;
                  &lt;table border="0" cellpadding="0" cellspacing="0" width="100%"&gt;
                      &lt;tr class='portletHandle' id='handle_welcomeMainPortlet' &gt;
                          &lt;td width='100%' height=0 align='left' valign='top'&gt;
                              &lt;table border=0 cellspacing=0 cellpadding=0 width='100%'&gt;
                                  &lt;tr&gt;
                                      &lt;td width=0 height=0 align='left' valign='top' style='display:none'&gt;
                                      &lt;/td&gt;
                                  &lt;/tr&gt;
                                  &lt;tr&gt;
  
  
  &lt;!-- MAIN CONTENT WITH DIVS OR TABLES  GOES HERE --&gt;
  
  
  
                                  &lt;/tr&gt;
                              &lt;/table&gt;
                          &lt;/td&gt;
                      &lt;/tr&gt;
                  &lt;/table&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>