How can I eliminate the inline styles included by default with the Genesis framewrok?

I have created a child theme in the Genesis framework. I have created all of my style rules, however, in the markup, Genesis adds a few inline rules by default that I would like to eliminate.

The rules look like this:

Read More
<style type="text/css" media="screen">
    html { margin-top: 28px !important; }
    * html body { margin-top: 28px !important; }
</style>
<style type="text/css">
    #header { background: url(http://localhost/h.jpg) no-repeat; }
</style>

These inline styles are creating my last remaining problem. I’ve reviewed the docs and tried to find if there are any hooks or parameters that I can alter, but have not found any.

How can i get rid of them across the entire child theme?

Many thanks.

Related posts

Leave a Reply

4 comments

  1. The first inline CSS is added by WordPress automatically when you are logged in and viewing the front end. It is part of the CSS for the WordPress adminbar.

    <style type="text/css" media="screen">
     html { margin-top: 28px !important; }
    * html body { margin-top: 28px !important; }
    </style>
    

    For the second part of the inline CSS I would check around in Genesis for add_action(‘wp_header’ ..

  2. Add a class on header.php

    <html <?php language_attributes(); ?> class="top">
    

    and add css on style.css

    .top{
        margin:0px !important;
        padding: 0px !important;
    }
    
  3. Just comment out what you dont want by adding /* and closing it with */ like this

    <style type="text/css" media="screen">
    /*html { margin-top: 28px !important; }
     html body { margin-top: 28px !important; }*/
    </style>
    <style type="text/css">
    /*#header { background: url(http://localhost/h.jpg) no-repeat; }*/
    </style>
    

    Notice how they become grey and inactive

  4. The best way I’ve found to remove that white space (it’s not caused by the admin bar) is to search out this css in style.css:

    page {

    margin: 2em auto;
    max-width: 1000px;
    

    }

    and switch the 2em to 0em or some variation of the same. That will remove the white space.