AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |
Back to Blog
Using important is considered a bad practice in CSS precisely because it does upend the styling priority system (CSS is called “cascading” for a reason). An Alternative Solutionīut this is starting to get ugly. On the other hand, with visibility:hidden, the element continues to occupy its space, though without displaying its content. When the element is hidden, visibility:none gives up the space the element would normally occupy. Visibility lets you control how much space a hidden element takes up. If you’re going to use CSS style rules, you might want to consider using CSS’s visibility property instead of hidden. With the important rule added onto the hidden attribute, the hidden attribute overrides any CSS rules applied to the element-you’ll always get the result you expect (for the record, this is the way the style rules that ng-show and ng-hide used were configured). If you want the hidden attribute to work every time, then, in the stylesheet used by the page, you can add the CSS important rule to the hidden attribute, like this. A rule that, for example, sets the CSS display property to anything but none will cause your content to display if display is set to none, then it doesn’t matter what you set hidden to. As a result, if there’s a CSS style rule assigned to your element that causes the element to appear, then it doesn’t matter what you set the hidden attribute to. The problem with using the hidden attribute, though, is that the attribute has a lower priority than CSS rules. Effectively, with this solution, you’re managing the HTML yourself and eliminating CSS … possibly. Interestingly, under the hood, both ng-hide and ng-show were applying CSS style rules to control whether the content was displayed. What this solution does is cause the hidden attribute to be added to the span element when bolShow is false and be skipped when bolShow is set to false. If you set hidden to the strings “true” or “false”, for example, because those values are string, they’re always truthy and the span tag’s content will always be visible.
0 Comments
Read More
Leave a Reply. |