Header Cut Off

Do you have a link to your website?

https://notjustatripletmom.com/

https://atozediting.net/

Dear hineschica

WE had visited your site and we didn’t notice any cutoff on your header image. So could you provide us screenshot where your image is cutoff with comparison to normal image

we look forward for your response.

Thanks

I don’t see an option to attach a screen shot.

Please use “Lightshot” app to take screenshot and send us screenshot link

Thanks

Yes, I can take a screen shot. I just don’t see a place where I can attach it to this thread.

Hi There,

You can just keep the link here. We hope you understand.

Thanks

I will do this later tonight or tomorrow.

Sure, we look forward to your respond.

Chrome: https://prntscr.com/ax1gpl

IE: https://prntscr.com/ax1h4x

IE: https://prntscr.com/ax1het

Chrome: https://prntscr.com/ax1hno

Hi There,

Please use the following css to fix your issue:

@media screen and (min-width: 1200px) {
  .header-inner{
    padding: 5rem 0 2rem 0 !important;
  }
}

NOTE: Please use the custom css plugin or child theme style.css to write the css.

And you can adjust the padding as per your desire, we have kept it 5rem, so you can increase/decrease it.

We hope this will be helpful to you, if not then please let us know.

Thanks

Where do I place this? Am I replacing CSS?

My apologies, but I’m not familiar, nor comfortable with, adjusting the CSS. I haven’t done it before.

Hi There,

Please use the simple custom css plugin or child theme style.css to write the css.

Thanks

I did this, and I’m still having issues — particularly on different devices. See the links below.

iPad
https://prntscr.com/b05qnr
https://prntscr.com/b05s5e

Tablet
https://prntscr.com/b05r64
https://prntscr.com/b05ryk

iPhone
https://prntscr.com/b05rfk
https://prntscr.com/b05rpz

please use this in your css

.header-bg {
    background: no-repeat !important;
}

and if you want full image in small device too then, please use below code

@media (max-width: 768px) {
.header-bg {
     background-size: contain;
    -moz-background-size: contain;
    -webkit-background-size: contain;
}
}

Note: add both code snippet in style.css and manage padding/height as per your need