[iroersma]

Hi, I would like to have less Grey & white in the top (side bar) that under a screen res from 1600×900 I still see the 4boxes (Featured Content layout) ?
For the website ikschmink.nl/

Many Thanks, Ivo

[Sakin]

@iroersma: I am bit confused with your question. Which section are you talking about? Is it top or sidebar or 4 boxes. How about the screen res. Do you want it to reduce only in that screen res?

[iroersma]

I would like to show our site visitors more content on the screen.(mainpage)
So one of the things I would like to reduce is the grey & white above the logo & sociallinks/zoek, but also under it, till the menu.

We could win 2x 40pcx there in the white part, and also 40pcx in the grey part in the top.

I hope this explains it a litle better 😉
Thanks !

[Sakin]

@iroersma: YOu can reduce the px amount as per your need and then add the following CSS in “Appearance => Theme Options => Custom CSS” box.

/* For Grey above site */
.site { margin-top: 20px; }
/* For above and below logo and social icons */
#site-logo, #header-right { padding-top: 20px; }
#hgroup-wrap { padding-bottom: 20px; } 

[iroersma]

Excellent !!! Many thanks 😉

[Ken]

Hello,
I also would like to reduce the amount of white space in the header above my site tile. I have tried many of the codes listed and have been able to customize many parts of my test web theme but I can’t seem to get that. This is the custom CSS I am already using:
.entry-title {
display: none;
}
#site-title {
font-size: 55px;
font-family: ‘Brush Script MT’;
font-weight:Bold;
padding-bottom:0px;
padding-top:0px;
}
#header .logo-wrap { margin-top: 1px; }
#header .social-search { margin-top: 1px; }
#hgroup-wrap { padding-top: 1px; }
#hgroup-wrap { padding-bottom: 10px; }

#header-top { padding-top: 0; }
#header-top p.simple-image { margin-bottom: 0; }
#header-content { padding: 0; }

/* For Grey above site */
.site { margin-top: 10px; }
/* For above and below logo and social icons */
#site-logo, #header-right { padding-top: 10px; }
#hgroup-wrap { padding-bottom: 10px; }

end of CSS

The web site is http://www.krwtest.com

I am hoping to reduce the total header height above the text Cutting Edge Catering. The search box and social links can hopefully adjust down?

Thank you for your help in advance.

[Sakin]

@Ken: You can add the following CSS in “Appearance => Theme Options => Custom CSS” box.
#hgroup { padding-top: 0; }

Also I am bit worried about the css that you have added

#site-title {
font-size: 55px;
font-family: ‘Brush Script MT’;
font-weight:Bold;
padding-bottom:0px;
padding-top:0px;
}

This css with make font bigger in mobile devices as well. So, you can replace that with the following:

#site-title {
font-family: "Brush Script MT", sans-serif;
font-weight: bold;
padding-bottom: 0;
padding-top: 0;
}
@media screen and (max-width: 769px) {
font-size: 55px;
}

[Author]

Posts