-
Notifications
You must be signed in to change notification settings - Fork 27
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
parseStylesheet crashes on @media rules #11
Comments
👍 |
👍 👍 👍 👍 👍 👍 |
Would it make sense to be able to set a screen-width and have inlinestyle decide if it should keep the part between the media-query or not? Or should everything between media queries be removed? |
To me, it doesn't make sense to actually use any rules from within a I'd personally be fine with the parser just skipping @media blocks. On Fri, Dec 13, 2013 at 2:56 AM, Christiaan Baartse <
|
That's a good question, and I'm not yet sure what the general expected outcome would be. For my personal needs, if the media block was within the same document, in |
@christiaan With regards to setting a configurable screen width: I don't think that would be completely useful, because many media blocks may use relative units ( |
What do you think about this idea (a bit of a hack, but workable): In special cases where media-queries are required (and thus, the client is obviously CSS-friendly), media-queries should be placed in a <style data-inliner-ignore="true">
@media only screen and (max-width: 41em) {
div.wrapper { width: 100% !important; }
div.boundry { width: 100% !important; }
div.footer { width: 100% !important; }
}
</style> Elements with that attribute ( It's a littler janky, but it's what I'm about to implement now, as I'm pressed for time on a particular project that uses InlineStyle + media queries. |
I think the way the guys from ZURB do it, for their "Ink" Email CSS framework, is the best way: http://zurb.com/ink/inliner.php Like you mentioned christiaan, when the CSS rules are parsed, media blocks which are found are put inside a style tag, but located inside the body not the head, and this happens not only for media blocks but also for any rule that contains pseudo classes. This way everything should work out as expected, and email clients that can understand these CSS rules can use them, |
Is it important that those style tags are placed in the body and not in the head? I think using the inliner from zurb as a example on this might be a good start. |
The stylesheet parser is naive and assumes that there are never nested rules, which is not the case when CSS3
@media
is used. When one of these is encountered, the parser crashes. I don’t know that these actually need to be supported, but it would at least be good if they were safely ignored instead of causing a crash.The text was updated successfully, but these errors were encountered: