[Resolved] Inline CSS is Problematic

Home Forums Support [Resolved] Inline CSS is Problematic

Home Forums Support Inline CSS is Problematic

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #771657
    Matthew

    I don’t like the standard 768 cutoff for mobile. I would prefer to set mobile at 650. I was able to override most of this in my child theme CSS file so I can delay generation of the hamburger menu until 650.

    But… the inline CSS generated by css-output.php (and other files) is a pain to deal with because it changes my header pixel height and site title, amongst other things, at 768.

    This occurs in the css-ouput.php file at lines 458 and 510 in the code. But 768 is also generated elsewhere in the inline css. What’s the best solution for this so that the WP customizer still works and I don’t go hacking the main theme code? The only thing I can think of is for your team to hardcode a menu option in the customizer for max-width.

    #772271
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    The inline CSS media queries are actually filterable.

    You should be able to do this:

    add_filter( 'generate_mobile_media_query', function() {
        return '(max-width: 650px)';
    } );

    Let me know ๐Ÿ™‚

    #772332
    Matthew

    That’s like magic! Thanks a ton!

    #772343
    Tom
    Lead Developer
    Lead Developer

    You’re welcome ๐Ÿ™‚

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.