Im setting up a new theme I haven’t worked with yet. I have positioned the header logo to be in the required “Header Images” area. The suggested size is 400px x 80px. I’d like the image to be 400 x 143px. I figured this would be a quick fix on changing up the CSS to make the container work for the new image. However, I have tried tweaking this block of CSS. I assume that is where the problem lies.
I figured it must be the height? Or the background-size? Nothing is working. Any help is greatly appreciated. Here’s a link to the site. https://107.180.20.86/~prospice/
107.180.20.86 uses an invalid security certificate.
The certificate is only valid for the following names: *.prod.iad2.secureserver.net, prod.iad2.secureserver.net
(Error code: ssl_error_bad_cert_domain)
For some reason, GoDaddy said to use this mock up domain. The old site still has to remain live until this is complete, so they set up this “not really secure” domain for me. I noticed I had to click through to accept the non-secure version so I could use Firebug. They said to enter it https//: but, it would be functioning as an http//: site. I am not collecting data or anything weird, but I can see how it would be off putting. To get feedback from the community, what is the best approach here?
Do you guys mind taking a look at this again? I got it running from the proper domain, so it is now accessible. Should I repost this? Or will I get dinged for a sorta-re-post? I have tried everything! Thanks in advance if you do have time to look. www.quillence.com You will see right away that the logo in the header is stuck in some container I cannot figure out how to resize.
Exactly what is the problem again, please? I see that the “quillence” logo appears to be cropped by design. Does that have anything to do with the issue?
Yes, the child theme suggests you crop the header image to 400px x 80px. I thought I could change that with CSS. So I have been tweaking around with the below properties. Tried changing height, background-size, is this unattainable?
.header-image .site-title > a {
background-position: center center !important;
background-size: contain !important;
display: block;
height: 143px;
margin: 0 auto;
max-width: 400px;
}
.site-title a {
background: rgba(0, 0, 0, 0) url(“http://quillence.com/wp-content/uploads/2016/01/cropped-LOGO_72DPI.jpg”) no-repeat scroll 0 0 !important;
AHHHH…just noticed it was cropped in the image upload! Re-uploaded the image, and now it works!! Thanks for the second set of eyes. My goodness, that took way too much time for a SIMPLE solution. Thanks @ronpat! Seriously.
