media queries are removed #13

GotenXiao opened this Issue Nov 17, 2011 · 8 comments


None yet

4 participants


Given the following sample code:

<!DOCTYPE html>
        <style type="text/css">
            @media screen and (min-device-width: 480)
                        width: 480px;
                border: 1px solid black;
        <div id="content">
            <h1>Hello world</h1>

I would expect the default border rule to be applied, and the media query hunk to be left alone (since it will only be parsed and used on compatible devices).

As a potential quick fix, pynliner could exclude processing of style or link blocks that have media query-like syntax, or are present and not screen.


Quick fix patch:

index 7d6fa52..13c2f27 100644
--- a/pynliner/
+++ b/pynliner/
@@ -29,6 +29,10 @@ class Pynliner(object):
     style_string = False
     stylesheet = False
     output = False
+    exclude_if_media = True
+    inline_media_types = [
+            'screen',
+            ]

     def __init__(self, log=None):
         self.log = log
@@ -151,6 +155,15 @@ class Pynliner(object):

         style_tags = self.soup.findAll('style')
         for tag in style_tags:
+            if self.exclude_if_media:
+                skip_tag = False
+                for attr_name, attr_value in tag.attrs:
+                    if attr_name == 'media' \
+                    and attr_value not in self.inline_media_types:
+                        skip_tag = True
+                        break
+                if skip_tag:
+                    continue
             self.style_string += u'\n'.join(tag.contents) + u'\n'

Obviously this doesn't try to parse the CSS itself, but this is probably an acceptable workaround for now.

rennat commented Nov 28, 2011

I like the approach you have taken here but I think we should look at applying this more generically so that any css that cannot be inlined will be left alone in a style element.

rennat commented Nov 28, 2011

What would be helpful here is building up tests for each of these cases where the css cannot be inlined.

I can write the tests but I am not aware of everything that can and can't be applied inline. I plan to research the specification further when I have time but as I'm not sure when that will be feel free to submit test cases or even a list of css declarations to test for.

mrmch commented Jun 27, 2014

@rennat any updates on this? Happy to contribute if needed. Better support for media queries in pynliner would be grand.

rennat commented Jun 28, 2014

Nope. I've started, very slowly, on a complete refactor to address some of the reported issues so far (mainly the speed and limited support for templating languages without breaking the current API/tests) but I have not done anything with the current codebase related to this issue. I'll happily check out pull requests for it tho!


+1 to merge the PR #38

Is this project abandoned? No commits since 2014, happy to help maintain if you need someone.

rennat commented Nov 4, 2015

not abandoned yet :) just maintained by busy people :(

rennat commented Nov 4, 2015

#38 does look good

@rennat rennat closed this Nov 4, 2015
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment