Hanging logo doesn't work

[yingfuli]

Hi,

On this website - https://hebri-flex.nl - I want to have the logo hanging from the menu bar. I know I’ve managed in the past to achieve this but no matter what CSS I use I can’t seem to get it done now. Probably I have something set somewhere that prevents it, but I have no idea what. Could you point me in the right direction?

[ruenel]

Hello @yingfuli,

Thanks for writing in! I have logged in and I can see that you are using Pro theme. Please be advised that the bar element in the custom header will hide the overflow of the elements which is any excess of the image will not be visible. Please add the CSS overflow property to the bar element in the “Customize” tab and make it visible and mark it as important, overflow: visible !important;. And then make sure that your logo image has a background image. And please do set the image with “Standard” type with a maximum width as well.

To learn more about the CSS overflow property, please check this out:

• https://www.w3schools.com/cssref/pr_pos_overflow.asp

[yingfuli]

Thanks!
One more question: is it possible to have the image or the container have the same box shadow as the bar? I tried applying one one the image but that doesn’t really work.

[friech]

Hi @yingfuli,

You can apply a box-shadow on the image as to how you apply the shadow on the container. The problem with that is the shadow will be applied around the image (square), if you need a shadow around the logo, you need to do that in an image editor application and reupload your logo.

Thanks,