Bloggy theme – make logo larger

lookingupphoto · Member · Jun 1, 2015 at 4:45 pm
Copy link

Add topic to favorites
I am trying to make my logo larger in my Bloggy theme site.

I used the code

.site-logo {
width: 18%;
}

and well as

.site-logo {
width: 30px;
}

with different numbers for % and px. While it “works” by making the logo appear larger, it decreases the quality of the image. The file used for the logo is large enough to be made larger and maintain the quality.

Any help would be greatly appreciated!!!!

Many thanks!!!!

Karen

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Jun 1, 2015 at 9:18 pm
Copy link
The logo image is resized to a smaller image, which is why when you enlarge it it loses quality. We can, however, use the following CSS to place your full-size logo image in the #toppart div and then hide the one in .site-logo. Give the following a try and see what you think.
```
#toppart {
    background: transparent url("https://lookingupphoto.files.wordpress.com/2014/10/looking-up-straight-teal-brown-transparant-logo-mock999.png") no-repeat scroll left top / contain ;
}
.site-logo {
    visibility: hidden;
}
.site-logo-link {
    display: block;
    line-height: 90px;
    width: 270px;
}
```
lookingupphoto · Member · Jun 1, 2015 at 10:31 pm
Copy link
Many many thanks!!!

It worked for my PC, looked great. But when I opened it on my iPad and iPhone the logo was huge, and hidden behind the blog posts. So…

Instead I hid the logo altogether, and created a header image with my logo. That seems to be working well enough for PC, iPad and iPhone.

Many thanks again!
thesacredpath · Member · Jun 1, 2015 at 10:35 pm
Copy link
Super, glad you found a solution. I’ve used this solution before without problems, so not sure what happened. I’ll have to look into that.

No items found.