studios

Here is my test site where I am unable to remove the white space below the header and above the “test title image.”

https://blindliberal.com

Also I am using the mega menu plugin but if I deactive it to the regular links I do have the same spacing problem.

thanks – any help is appreciated.

• This reply was modified 5 years, 5 months ago by studios.

When I use the code from that link

.site-content {

overflow: hidden;

display: none;

}

It just makes my site vanish on the page – The header stays visible but the page content disappears. I am putting this code in the “customize/ additional csss box.

I can’t get rid of the white space below the header as well.

Thanks

• This reply was modified 5 years, 5 months ago by studios.
• This reply was modified 5 years, 5 months ago by studios.

thank you James Huff – I found the setting in the free part of the plugin thanks to your insight

problem is solved.

Unfortunately I reinstalled it as a zip file from the link you listed above to make sure I was looking at the same plugin which it is, and they want you to purchase it.

It does have a few minor things you can use on it by default but then wants you to “upgrade/ purchase” it in order to use anything useful on it.

Is this options-twentynineteen plugin “open source” and fully functional without any time constraints, time limits, or subscription ties? Are there any intellectual property laws that will inhibit me from using it with my site going forward? I don’t mind paying for something “if I can actually use it without dependencies.” – Loathe subscriptions, and ongoing dependency.

It doesn’t say on their site, or missed their terms to use it.

In a perfect world I would love use a “code solution” if possible. I am grateful for the twentynineteen template (it’s really nice!) and wish there was more flexibility with the feature image so I could use it with some more control. I love the theme except for the darkening effect which takes away a designers ability to work with it.

Deeply appreciate your feedback James Huff

• This reply was modified 5 years, 5 months ago by studios.

resolved

Thank you James Huff – worked perfectly!

Thank you James Huff but that is the code I am working with in a child theme and also in the additional css

.site-header.featured-image:after {
background: none;
}

I have tried it on both one at a time, also on both at the same time. I also have cleared my cache and restarted my browsers in firefox and brave-browswer to no avail.

I have also tried

/* Controls feature picture background, and can change opacity to make the picture brighter */
.site-header.featured-image:after {
opacity: 0.4;
}

but it just stays the same – is there more code or specific placement that needs to happen?

thank you very much for the response

Thank you CrouchingBruin

I will be vigilant when twentythirteen updates occur, especially regarding the header.php file

Thanks to your header post advice link, that solved both my problems perfectly in all browsers and devices.

I cant thank you enough!

One question

Now that I have replaced the header.php file to make my header image repsonsive in my twentythirteen-child folder, will the header.php file be updated property, or will that matter?

I can launch problem two in a different thread if its in conflict of the first

thanks

I did not want to post again until I tested thoroughly and could offer some useful information, and also am grateful for the comments already given, as my sites look “much” better than they did before the previous comments. However the white space and the header still have some issues.

My Sites – both twentythirteen and both have the same issues
https://www.blindliberal.com
https://www.blindliberalism.com
Child-themes in place

I have tested against practically every device, computer and os and have isolated where I am getting anomalies regarding the white space that appears below the header but above the drop-down menu

Problem one – the white space (between header and drop menu) is infrequent with different devices, and also on computers/laptops – mac/windows/linux – ie/firefox/icedragon.

The problem arises when the twentythirteen layout responds to “ being viewed at a mid-sized point” in a browser window on computers/laptops, BUT the same problem occurs in the “full view” on devices on larger phones or smaller phones in landscape view.

For example when you shrink a floating browser window on a computer or laptop the side bar will snap to the bottom; it’s at that point where the white space will appear on a computer. However for phone devices the portrait view is perfect for the smaller and mid-sized iphone 4, iphone 5 and blackberry z10, yet in landscape view on these samee devices the white space will appear.

Also on an iphone 6 plus due to its size the portrait view and landscape view both show the white space. I don’t think this problem is a “device issue” but a “size response issue” of some kind. However I am not a programmer and someone here with the technical prowess may be able to better articulate the issue and know how to solve it.

ipads and tablets work great.

Problem two – Header gets cropped on left and right sides on mobile devices (want the whole header to scale down if possible)

any further help is highly appreciated

thx

thank you immensely CrouchingBruin

pc/mac/linux
iphone 4
iphone 5
ipad
ipad mini
blackberry z10

all perfection!

iphone 6 plus continues to have the same problem. I have cleared the cache, rebooted, cleared cache a second time, and then loaded the site fresh. I think its a limitation of the iphone 6. It also has the latest updates from apple.
I am also getting a friend to test on a galaxy phone later tonight

I’m indebted to you expertise CrouchingBruin

thank you

CrouchingBruin said – @studios, can you please post a link to your site?

blindliberal.com

My header also disappeared in mobile devices when removing the site title in twentythirteen

However, though placing this code into my child-theme style.css file did enable the header to appear in my mobile devices, the tall white space between the header and the menu still exists. I did add the “px” after the size “210” as wpsol suggested. 210 is the exact size that I need the header to be.

/* Collapse oversized image and pulled images after iPad breakpoint. */
@media (max-width: 767px) {
.site-header .home-link {
min-height: 210px;
}
.site-title {
font-size: 36px;
padding: 8px 0 10px;
}
…
}

CrouchingBruin mentioned that it may also require the “background-size property to be modified. Does anyone know the code for the .css file for doing so? Will this complete the solution?

thank you kindly and also for the previous entries