Too much space at header bar.

Resolved mikw365
(@mikw365)

10 years, 9 months ago

Hello,

I’m very new to this and just started to learn WordPress and all seems overwhelming to me.

I’m using the free Pinboard theme and after reading alot of support here on other people’s struggles I’ve managed to (just) upload a test logo found out how to remove the Search bar by using the follow CSS code:

#header #searchform {
display: none;

It got rid of the Search bar which is great, but I’m still getting alot of white space above and below the logo. How can I go about reducing this?

I’m looking at the CSS coding and it all means nothing to me really… 🙁
I’ve tried alerting a few of the values on them #header section but it didn’t really seem to change anything.

Any Help would be much appreciated.

Thank you

Viewing 10 replies - 1 through 10 (of 10 total)

wp-21
(@wp-21)

10 years, 9 months ago

Please post a link to your site.
And you can look at the padding or margin values to decrease the space.

Thread Starter mikw365
(@mikw365)

10 years, 9 months ago

Hi,

Oh sorry forgot, here you go: http://www.mwgraphicdesigner.com

I’ve tried to alter a few of the padding and margin values, and checking the site, but it don’t seem to make a difference. I think I’m not changing the right codes as there seems to be so many of them.
wp-21
(@wp-21)

10 years, 9 months ago
This property needs to be looked at:
```
#site-title, #site-description {
    float: left;
    font-weight: 300;
    line-height: 150px;
    margin: 0;
}
```
Decrease the line-height property here.

And this property:
```
#site-title img {
    margin: 38px 0;
    vertical-align: middle;
}
```
Decrease the margin value here.
And do all the changes inside child theme only.

Cheers.:).
Thread Starter mikw365
(@mikw365)

10 years, 9 months ago

Thanks, giving that a try now.

Thread Starter mikw365
(@mikw365)

10 years, 9 months ago

OH!!!! it worked!!

#site-title,
#site-description {
margin:0;
font-weight:0;
float:left;
line-height:0px;

#site-title img {
margin: 0px 0;
vertical-align:middle;

Thanks you very much for your help.

wp-21
(@wp-21)

10 years, 9 months ago

Great to know…:)..
But don’t change that line-height to 0px, instead change it to normal.
And mark the topic as resolved pls.

Cheers.:)…

none
(@erinpaul3713)

10 years, 8 months ago

I’m having similar issues, and this code really helped! However, I’d like to have less space between the bottom of the header image and the menu bar.

Here is my site.

I need to reupload the header image since the “p” in composer was cut off, but I’d like to get the custom CSS fixed before I worry about that 😉
wp-21
(@wp-21)

10 years, 8 months ago
Hi, in your site the space is appearing due to a #sidebar-header div.
You need to hide that via css, its around 638th line in your css file,

Just add the css property:
```
#sidebar-header{
   display:none
   }
```
in your child theme style file and you will be good to go.

Cheers..:)..
none
(@erinpaul3713)

10 years, 8 months ago

Thank you so much, it totally worked! I put it in the custom CSS box that’s part of the Pinboard theme, that way I didn’t need to make a child theme. Does that matter eventually? Thanks again!! 🙂

wp-21
(@wp-21)

10 years, 8 months ago

HI, that’s great…..no it doesn’t matter as long as you don’t edit the theme files directly bcoz if you make changes to theme files directly you will loose any changes if you update the theme later on….

cheers..:)..

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘Too much space at header bar.’ is closed to new replies.

Tags