The CSS language is stuffed with small gaps that are irritating to navigate. Between CSS properties to cover a container and its contents, there’s nonetheless room for enchancment. visibility: hidden retains peak and width integrity whereas show: none on a container hides every thing. You need to use .container > * to cover all contents of a container, however what if there was a greater approach?
There’s a higher approach to cover the contents of a component whereas respecting the container’s border and dimensions. That higher approach is utilizing the content-visibility property:
.my-container.contents-loading {
content-visibility: hidden;
}
A demo of such performance:
See the Pen Untitled by David Walsh (@darkwing) on CodePen.
Avoiding a .container > * selector by utilizing content-visibility: hidden is a lot nicer from a upkeep perspective!
9 Thoughts-Blowing Canvas Demos
The
<canvas>factor has been a revelation for the visible consultants amongst our ranks. Canvas supplies the means for unimaginable and environment friendly animations with the added bonus of no Flash; these builders can flash their superior JavaScript expertise as an alternative. Listed below are 9 unbelievable canvas demos that…
How I Stopped WordPress Remark Spam
I like virtually each a part of being a tech blogger: studying, preaching, bantering, researching. The one half about running a blog that I completely detest: coping with SPAM feedback. For the previous two years, my weblog has registered 8,000+ SPAM feedback per day. PER DAY. Bloating my database…
“High” Watermark Utilizing MooTools
Every time you have got an extended web page value of content material, you typically wish to add a “high” anchor hyperlink on the backside of the web page in order that your consumer would not must scroll ceaselessly to get to the highest. The one downside with this technique is…
Document Textual content Picks Utilizing MooTools or jQuery AJAX
One method I am seeing an increasing number of lately (CNNSI.com, for instance) is AJAX recording of chosen textual content. It is sensible — if you happen to detect customers deciding on the phrases time and again, you possibly can in all probability assume your guests are looking out that time period on Google…
[ad_2]
