Typical for a search bar, I've added a magnifying glass icon on the left side for UI purposes. On desktop it looks fine and stays at the position nicely. However, when switching to mobile the icon is repositioning itself according to the device width.
I thought by increasing the left
parameter for @media (max-width: 768px)
it will be fixed but it seems to behave differently.
A gif of the issue with the code on the right side is added. What am I doing wrong?