guthik guthik - 9 months ago 35
CSS Question

Custom underline for a menu on hover and focus

I want to use this image as the underline for menu items on hover and focus (or when active). I have tried a lot of things but the image will not show up no matter what. Normal text-decoration underlines work fine. I am using the blankstate theme. Any suggestions and ideas will be greatly appreciated. The image is in the same folder as the custom css I want to use. You can check out the sample site here. This question's answer doesn't apply here I guess. I also tried this. By the way, I am assuming that the

<link rel="stylesheet" type="text/css" href="path_to_css" />


is taken care of automatically by the theme, if not, how can I access the header file to ensure that it is done. I am using elementor to edit the page.

Thank you all in advance.

Answer Source

you need to setup background-size property. after that take care of its position

for example, background-size: 100%