@import is importing. Aaargh

Hi all

I've found a really confusing and slightly frustrating 'feature' which I'd love your wisdom on.

I've got the following code at the top of my template

<style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,700italic,700,400);
</style>
<!--[if !mso]><!-->
<style type="text/css">
  @import url(http://www.mydomain.com/public/css/non-outlook.css);
</style>
<!--<![endif]-->

When I import this into campaign monitor, even if I don't select inline css, it imports the contents of my CSS file and puts it inside the style tags, and therefore inlines when I import my campaign.

<style type="text/css">
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,700italic,700,400);
</style>
<!--[if !mso]><!-->
<style type="text/css">
body {background-color: #E1DEE1;}
.third{
    width:33.33333333%;
}
.halves{
    width:50%;
}
</style>
<!--<![endif]-->

As per the above. It's exactly what I wanted to avoid because I only want compatible browsers to even import the code.

Yet Google's one 2 lines above stays intact and doesn't embed itself.

Anyone know how I can get it to not pull in the contents of my CSS file and just leave it the heck alone!

NOTE. I know there may be other ways to do what I'm trying to achieve but in my tests, this is working beautifully across all clients and so just need campaign monitor to play nice.

Thanks

Matt

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098