Can we use { opacity: 0 } instead of visibility?


#1

Can we use { opacity: 0 } instead of visibility?


FAQ: The Box Model - Resetting Defaults
#2

No, not really. They are different aspects. However, they are similar in that neither will change the size of the page. visibiity doesn’t collapse adjacent elements, but hides the content from view. It’s position and size will remain the same. So, in that sense, changing opacity will have the same effect. The difference would be that visibility: hidden; will not reveal any background content, whereas 'opacity: 0` will expose the background.