HTML e-mail template: Is it possible to add specific CSS rule for mobile only, that works on Gmail as well

I have a 2-column html template that has few blocks separated by borders.

Is it possible to make a Gmail-friendly code to get ride of that border for mobile resolutions? As far as I know, gmail doesn't read media queries.

<table ...>
    <tr>
        <td style="border-right: 1px solid #000;padding-left:20px;">...</td>
        <td style="padding-left:20px;">...</td>
    </tr>
</table>

Thanks

Although correct that Gmail doesn't support media queries, you may still be able to do this if you build it without borders in default version(inline styling) and use the media queries and embedded style sheets to style it on the desktop version.

For Gmail web client you can try to use the lang 'trick': http://freshinbox.com/blog/interactive-emails-in-gmail-using-css-attribute-selectors/.

This option is by no means a universal solution though as it takes quite a bit of code and comprehensive testing. Plus not all stylings are accepted via media query and embedded style sheets by email clients.

It also does mean that clients like Google Apps (which also ignores all style sheets) will display a mobile version.