Elemin theme Can I remove the bar under the header with css?

Home Forums Automattic Elemin Elemin theme Can I remove the bar under the header with css?

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #163269 Resolve

    Serealities
    Member

    Is there any way to remove the bars that sits just below the header in the elemin theme? http://serealities.com

    I want something less 90’s looking and it is a pain to start with a new theme :/

    Many thanks!

    #163272

    Kathryn P.
    Happiness Engineer

    If you’d like to remove the border just above the top menu, add this to your custom CSS:

    #access {
        border-top: none;
    }

    If you were trying to remove something else, could you explain which element in a bit more detail? Thanks!

    #163275

    Serealities
    Member

    Wow, that’s cool! Is there also any way to make the header go all the way to the border so that there is no white around the header other than below it?
    Many thanks!

    #163282

    Kathryn P.
    Happiness Engineer

    This will remove the padding on the entire page, which is what’s adding the whitespace around the header image:

    #page {
         margin-top: 0;
         padding-left: 0;
         padding-right: 0;
         padding-top: 0;
    }

    After you do that you’ll need to add back padding on the rest of your content.

    This should add padding back on the main page content:

    .entry-content, .entry-summary, .singular.page .hentry {
      padding-left: 20px;
      padding-right: 20px;
    }

    And the widget area:

    #supplementary {
        padding-left: 20px;
        padding-right: 20px;
    }

    And the footer:

    #site-generator {
    padding-bottom: 20px;
    }

    #top-link {
     bottom: 0;
     margin-bottom: 10px;
    }

    If you add the above code, I’d suggest you look at all the pages on your site and spot-check your posts to make sure everything looks as expected, as well as on mobile devices, as layout changes can have unintended side effects.

    #163284

    Serealities
    Member

    that is awesome!! the only side effects show up on pages where I have titles. The titles are kind of shoved up against the margin. Unless there is any css to correct that, I can live with it. I don’t suppose there is a way to make this a full width page such that the white (all under the header) spans the page?

    #163285

    Kathryn P.
    Happiness Engineer

    Ah, good catch. This should take care of the titles:

    .page-title {
      padding-left: 20px;
      padding-right: 20px;
    }

    I don’t suppose there is a way to make this a full width page such that the white (all under the header) spans the page?

    I’m not exactly sure what you mean, but you can change your purple background colour to white in the Customizer’s Colors and Backgrounds panel, is that what you’re going for?

    #163291

    Serealities
    Member

    You are amazing! Many thanks!!

    #163293

    Kathryn P.
    Happiness Engineer

    You’re welcome!

    I’ll mark this thread as resolved but feel free to start a new one if you need help with anything else.

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.