开发者

CSS display:none and visibility:hidden

开发者 https://www.devze.com 2023-01-13 18:59 出处:网络
I have a div that I use to display alerts when needed. If I want to close it after a while can I use display:none or should I use display:none as well as visibility:hidden?

I have a div that I use to display alerts when needed.

If I want to close it after a while can I use display:none or should I use display:none as well as visibility:hidden?

So one or both.

开发者_Go百科

Thank you.


Depends. If you need the space to be left blank, that is, the space won't be taken up by other elements below or around it, you'll need visibility: hidden. Otherwise, use display: none, which will allow other elements to move into the element's place.

There's no reason to use both.


If your hidden content needs to be accessible—to those with screen readers, for example—then you should not use display: none or visibility: hidden, as both can potentially hide content from screen readers. Instead, you should use a more accessible approach, such as moving the content off screen with a negative margin. See the following links for more information:

456 Berea Street: Hiding with CSS: Problems and solutions
WebAIM Blog: Hiding content for screen readers


Visibility:hidden hides the element but it still takes up space in the layout. Display:none removes it completely.

In your case, I would use Display:none

0

精彩评论

暂无评论...
验证码 换一张
取 消