Responsive Logo

[blendenzaehler]

Hello,

i habe a problem, on my site http://www.blendenzaehler.de when i show it on my ipad in the landscape mode, my logo was cuttet of....
Can anybody helps me what I need to adjust.

I have switched now to public view.

Thanks for your help.

[WisdmLabs]

Hi,

Add this css to your child theme style.css

.header-image .site-header .title-area
{
background-size:contain !important;
}

---

http://wisdmlabs.com/

[blendenzaehler]

Hi WisdmLabs,

it doesn't work, i have custimized the header from the eleven40pro theme for a bigger logo.

I need to replace that with your code?

.header-image .site-header .title-area {
background-position: center center !important;

}

[WisdmLabs]

Hi,

I am not able to view your website, it redirects to the login page..

---

http://wisdmlabs.com/

[CleanPageDom]

Hi there, blendenzaehler

Did you get this fixed? Couple of questions if not. Have you uploaded an @2x version of your logo? Have you changed the dimensions for the site logo in the retina settings on the style.css?

Upload an @2x version of your logo (ie one that is twice the size of the regular logo, with @2x at the end of the file name). Then, in style.css you need to find this at the top of the Media Queries (toward the bottom):

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {

.header-image .site-header .wrap {
background: url(images/[email protected]) no-repeat left;
background-size: 320px 164px;
}

}

And change the dimensions where it says "background-size" to match those of your original logo.

So, for example, if your standard logo is 100px x 100px, you need to create a logo that's 200px x 200px, name it "[email protected]" or whatever, upload it, then set the "background-size: 100px 100px;"

Thanks
Dom

---

Let’s build a website together…

[Author]

Posts