@aUnicornDev
Posted
Few things to point out,
1.Don't go to mobile view so early, you can shrink to upto 1000px and then go mobile
2.You probably used outline
property on hover because you didn't want the content to move the layout which would have happened in case you used border property.
But the outline does not create a rounded hover but a rectangular one.
A fix to that is.. use box-shadow: inset 0px 0px 0px 2px #fff;
instead of a border or outline..
Marked as helpful
@tttinh
Posted
Hi @aUnicornDev,
Thanks so much for your comment.
-
After watching some of tutorials on Youtube, I saw some of them recommend to use the Mobile-first approach. I am not sure which way is better. So I just take a try :).
-
I tested on Firefox, and saw the outline is rounded. But after read your comment, I have tested with Edge and found that it is still a rectangle. I will try with your solution.
Hope you have a good day.