Responsive web design with inline css
<p>I am actually creating an email signature with actual coding (For Gmail) and it looked just fine on the computer web. Unfortunately, the mobile version of the signature didn't turn out well and i wanted to try solutions like media queries, etc.. but Gmail only inputs <strong>INLINE CSS</strong> and unable to validate <strong>Outline CSS</strong> . </p>

<p>I tried using table, tr , td to think that the table would help to adjust automatically in the mobile but to no avail.  Will anyone be able to recommend me any solution for this? </p>

<pre><code>&lt;table cellpadding="0" cellspacing="0" style="margin:0; padding:0;border:0"&gt;
    &lt;tr&gt;
        &lt;td&gt;
        $container1   
        &lt;table cellpadding="0" cellspacing="0" style="margin:0;    padding:0;border:0"&gt;
            &lt;tr&gt;
                &lt;td width="450"&gt;  
                    &lt;div id="minicontainer1" style="padding: 5px 0 0 20px; height:80px;line-height:50%;box-sizing:border-box;"&gt; 
                        &lt;p class="font1" style="font-family: Helvetica; font-size:11pt;font-weight:bold; color:black;"&gt; $name &lt;/p&gt; 
                        &lt;p class="font2" style="font-family: Helvetica; font-size:9.5pt; color:black;"&gt; $position &lt;/p&gt;         
                        &lt;p class="font2" style="font-family: Helvetica; font-size:9.5pt; color:black;"&gt; $cell &lt;/p&gt; 
                    &lt;/div&gt;
                    &lt;div id="minicontainer2" style="  padding:0 0 0 20px; margin-top:-10px; line-height:50%;box-sizing:border-box;"&gt;
                        &lt;p class="font1 diffsize" style="font-family: Helvetica; font-size:8pt; font-weight:bold; color:black;"&gt; $company  &lt;/p&gt;
                        &lt;div class="font2 diffsize" style="font-family: Helvetica; font-size:8pt; color:black; line-height: 12px;"&gt; 
                            &lt;p&gt; $address. &lt;/p&gt; 
                            &lt;p&gt; Phone : &lt;span id="special" style="color: #0000EE !important; text-decoration: underline;"&gt; $telno &lt;/span&gt; | Fax :&lt;span id="special" style="color: #0000EE !important; text-decoration: underline;"&gt; $faxno &lt;/span&gt; &lt;/p&gt;
                        &lt;/div&gt;
                    &lt;/div&gt; 
                &lt;/td&gt;
</code></pre>

<p>This is just a small example for it and to show u how i have to use Inline CSS for everything. The file has php, html and css. Bootstrap is most likely unavailable too. </p>

<p>Just for visualization:</p>

<p><a href="http://i.stack.imgur.com/OhiR9.png" rel="nofollow">web</a></p>

<p><a href="http://i.stack.imgur.com/ekhme.png" rel="nofollow">mobile</a></p>