Search code examples
csspaddingimpresspages

Impresspages: site logo padding on bottom, in 'Air' theme; how to remove?

I have searched most of the css files, changed the logo padding in theme.css, but I cannot remove the padding on the bottom of the site logo. There seems to be a 5px padding at the bottom. Is there a way to remove this? Thanks.

Edit: Here is the code in Air theme's, theme.css file, where I can only find logo css references. Thanks again.

.logo {
  margin-top: 20px;
  margin-bottom: 0;
  display: block;
  float: left;
  padding: 0px;    
    
}
.logo a {
  color: #ffffff;
  font-family: 'Cinzel', 'Arvo', serif;
  font-size: 12px;
  font-weight: bold;
}

[[1]: https://i.sstatic.net/abkoc.png][1]

Solution

  • The problem is not a padding. The issues comes from browser's interpretation of img in <a> tag. By default all browsers render image with 3px bottom space (and it's not a margin nor padding; just an empty space).

    There are 2 ways to remove it:

    1. Float image
    2. Display image as a block

    In this case I'd choose the first option.

    .logo img {
    float: left;
}