wordpress - Override inline css -
wordpress theme using has inline css in header , 1 of things trying change header top/bottom padding. in inline css listed as:
<head> ... <style type="text/css" data-type="vc_custom-css"> #site-header:not(.shrink) .site-title { padding: 60px 0 !important; } </style> </head> <body class="home page page-id-24236 page-child parent-pageid-5 page-template-default logged-in admin-bar wpb-js-composer js-comp-ver-4.12.1 vc_responsive customize-support"> <div id="page" class="layout-fullwidth"> <div id="site-header-wrapper"> <header id="site-header" class="site-header" role="banner"> <div class="container container-fullwidth"> <div class="header-main logo-position-left header-layout-fullwidth header-style-3"> <div class="site-title"> <h1><a href="#" rel="home"></h1> </div> </div> </div> </header> </div> </div> </body> obliviously, #site-header:not(.shrink) .site-title {... !important} not going work in styles.css.
i have tried following , still doesn't work:
[style]#site-header:not(.shrink).site-title { padding: 1px 0 !important; } how override?
style blocks aren't stylesheet stink. despise when theme developers put them in theme. thing worse inline styles (ie <div style="padding: 5px !important;">). virtually impossible overcome.
in case, there's couple of hack-tastic way overcome hacky issue.
in child theme's functions.php file, can use following (admittedly hacky) solution:
// we're adding high priority of 9999 should cause output after theme's bad styles. add_action('wp_head', 'fix_bad_theme_styles', 9999); function fix_bad_theme_styles() { ?> <style type="text/css" data-type="vc_custom-css"> #site-header:not(.shrink) .site-title { padding: 1px 0 !important; } </style> <?php } if doesn't work, hackier way put style in footer. it'll work, it's not best-practice (as if of solution is!):
add_action('wp_footer', 'fix_bad_theme_styles');
Comments
Post a Comment