Edin Theme: Centering, Changing Colours & Reducing Padding

  • Author
    Posts
  • #3067415

    Sorry to ask so many questions. Familiar with HTML, but new to customizing anything with CSS.

    Is there a way to change the background color of the menu and website title area? They are both currently white and would be nice to have them stand out more.

    At the same time, would be great if both the menu and website title could be centered. Having everything aligned to the left doesn’t look great.

    Curious as to how, if possible, I could reduce the padding on the posts and sidebar? There is a huge amount of wasted space that I am trying to reduce.

    Thanks in advance for any help.

    The blog I need help with is ignorethecrumbs.com.

    #3067676

    Hi there, for the header area, the following should do it for you. The first rule is the background color, which you can edit as desired. The Media Query is to set the nav and title to centered. You will notice the !important keywords, which in general are used only sparingly as they can cause issues with other things later on, but in this instance I had to use them to override a few other Media Queries, otherwise I would have had to create a few other queries to override.

    #masthead {
      background-color: #cc0000;
    }
    @media screen and (min-width: 1020px) {
      .site-branding {
        float: none !important;
        display: block !important;
        max-width: 100% !important;
        widht: 100% !important;
      }
      .site-branding .site-title {
        text-align: center;
        display: block;
      }
      .primary-navigation {
        text-align: center;
      }
      .primary-navigation ul {
        display: inline-block;
      }
    }

    On the whitespace/padding on content and sidebar, can you explain a bit more what you are wanting to reduce?

The topic ‘Edin Theme: Centering, Changing Colours & Reducing Padding’ is closed to new replies.