I've created a new email using the mobile first method written about here by Julie Ng. Mostly, this method is working great, but I am having issues getting Gmail webapp to display the desktop version of the email (for elements to be not 100% wide).

I have applied min-width: 100%; inline to the tables which I want to be full-width on mobile and wish to change them to fix-width (40px) for desktop.

Right now I'm using this in the <style> tag to override the inline min-width, but it is not working in gmail:

.element {
    min-width: 40px !important;
    width: 40px !important;

I can see by that the styles are showing in the <head> of the email, but it is NOT overriding the min-width. Any ideas? Would it have anything to do with gmail's css naming? (eg m_8628875238964235544css-class)

I should add that this is also occurring for outlook.com webmail.