Hello, I have created a popup with html blocks. I’ve divided column into two 1/2 rows, since I want two clickable icons on the top (01 image). Icons should enlarge on hover (with transform: scale property). Adding custom css to icons affects whole container instead of just icons. Disabling unnecessary plugins changes nothing. I’ve added custom debug css to these icons, so I could see the affected area visually.
border: solid 3px green; for the left call icon and
border: solid 3px red;for the right mail icon. On desktop whole container is affected (02 image) and on mobile the same, execpt right one does not scale down (03 image). Solved first button being unclickable on mobile by adding z-index value (04 image with fix applied). Tried WPBakery buttons, Woodmart buttons, but the results from these are dissatisfying. How can I nicely scale icons on hover without affecting whole container?
You must be logged in
to view attached files.