CODEWITHSUNDEEP
cssmedia-queries
Robin Hwang
Robin Hwang

Reputation: 189

how to make css @media property inline ( about email responsive)

I'm trying to make my registration email responisve in mobile device,
and I wanna give @media property a try, but I cannot figure out how to make this inline, as I know, email's style should always be embedded...
the doc do not refer to that

any suggestion?

Upvotes: 1

Views: 3277

Answers (2)

Prashobh
Prashobh

Reputation: 9542

Media Queries is the best option but

Support for media queries is vastly different across email clients. Many clients, such as Gmail, don't support media queries at all.

<meta name="viewport" content="width=device-width" />


.container {
  max-width:600px!important;
  display:block!important;
  margin:0 auto!important;
  clear:both!important;
}

Upvotes: 1

David Nguyen
David Nguyen

Reputation: 8528

You cannot put it inline, you will have to put it in the head tags of html email within style tags. For example:

<head>
...
<style type="text/css">
    @media screen and (max-width:480px) {
    ...
    ...
    }
</style>
</head>

Upvotes: 3

Related Questions