Is it possible to resize the image on a #p-logo a tag?

Natalie J.

I have no mouth, but I must traffic.
Poll Committee
Pronouns
She/her
I have a picture I'd like for my #p-logo a tag, but it's too big to fit in the allotted space. I've tried changing the px and searching google, neither of which worked.
 
Within the curly brackets of the #p-logo a, add background-size: contain;.
 
and then what's the highest size I can use without it being too big for the space?
 
Code:
#p-logo a {
 background: url(http://www.mariowiki.com/images/3/3e/MK8_Roy_Icon.png) center/130px no-repeat !important;
}

This is the simple full code for your situation, you can mess around with the 130px to adjust the size as seen fit, you may already know this, but while editing your css, you can press "show preview" (or Alt+P) to see the results without having to save the page.
 
Mary Berry said:
and then what's the highest size I can use without it being too big for the space?
With that code, it will always be fit inside the available space no matter what. The logobox is 155×155 pixels in size.

Dashbot's code is a cool shorthand, though to make the image as big as can be you should replace the "130px" with "contain". If you want the image in it's original size, leave the "/130px" out entirely.
 
I think it's better to specify the size yourself, cause as far as I know the "contain" tag doesn't take the transparent edges of the image into account.
 
ok I got that to work

you can lock this now
 
Back