How to remove the grey square border around a close icon?

Technical Q&A
1

Hi,

How can I remove the grey square border that surrounds the close icon in the screenshot below?

This is for the modal that appears when a user selects a product.

Thanks :slightly_smiling_face:

grey border.jpg
grey border.jpg1002×444 36 KB

 

 

 

 

 

 
2

Hello @paul123 ,

Please share your site url so that I will give you exact solution

3

https://paule89123.github.io/coverful/surreal

4

Hi,
Try this

button.shopify-buy__btn--close:focus {
    outline: 0;
}

Add this in your css file

5

This doesn’t work for some reason. I seem to be unable to style any of the
shopify elements with my CSS file.

I should mention that I am using Shopify Lite (the Buy button JS SDK).

I have styled some of the shopify elements by editing the styles in the Buy
Button javascript, but I don’t think I can target the close button in this
way.

Do you have any more thoughts on this? Thanks.

6

I seem to have the same issue and this seems to be an old thread, was a solution reached?