I have used Mailchimp's 1-column template to create an email invite.
However, when I export the HTML out, render it with Mailchimp's CSS inliner tool and send a test blast to my email.
It looks okay on Outlook, but it does not display correctly on Gmail App. I understand that on Gmail App, it does not support media queries.
May I know what other ways can i make my template be mobile-friendly other than tweaking the media queries?
Use percentage measurements for your layout components. That way you can build a website that works on a much larger range of screen sizes. You can combine this approach with media queries - for example, you could specify that your site has a 25% wide navigation menu and a 75% wide content area on devices that are wider than 400px, but any smaller than that and it collapses to a single column layout with the menu hidden and accessible only through a menu bar icon.