Archived topic
Size of SVG Image in Top Bar
7 replies · Started by Pamela on March 16, 2021
I've moved the SVG logo from the navigation bar to the top bar using an image widget. However, there are two issues with it:
- I would like it to be centered instead of right-justified (but I still want the Lightweight Social Icons to be right-justified). How do I do that?
- I have it set in the widget to be 100 x 38 px, but browsers seem to be ignoring that size, with the result that it's huge. The optimized SVG is small, so I'd prefer to use it instead of a properly-sized JPG if I can. How can I make it the right size?
Thanks!
Hi Pamela,
For the logo alignment, you have this CSS added:
https://www.screencast.com/t/E4VPasMG
Change flex-end to space-between
For the logo size, try this CSS:
.top-bar .widget_media_image .image {
max-width: 200px !important;
}Let me know :)
Thanks, Ying.
The size code worked like magic. Beautiful!
space-between doesn't seem to have done anything. I did clear the cache.
You are welcome :)
And space-between is working fine now on my side, try to clear your browser cache as well.
https://www.screencast.com/t/s7lQrifXa
On my browsers it looks like yours: left-justified. But I would like it to be centered.
Oh you want the logo in the cetner? Sorry my bad :P
OK, then try this:
aside#media_image-2 {
margin-left: auto;
margin-right: auto;
padding-left: 43px; /*social icons width*/
}Perfect! Thank you very much.
No problem :)
