The CSS language is filled 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 all the pieces. You should utilize .container > * to cover all contents of a container, however what if there was a greater method?
There’s a higher solution to cover the contents of a component whereas respecting the container’s border and dimensions. That higher method 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 through the use of content-visibility: hidden is a lot nicer from a upkeep perspective!
CSS Filters
CSS filter assist just lately landed inside WebKit nightlies. CSS filters present a technique for modifying the rendering of a primary DOM ingredient, picture, or video. CSS filters permit for blurring, warping, and modifying the colour depth of components. Let’s have…
Fb Open Graph META Tags
It is no secret that Fb has turn into a serious visitors driver for all sorts of internet sites. These days even giant firms steer shoppers towards their Fb pages as a substitute of the company web sites immediately. And naturally there are Fb “Like” and “Advocate” widgets on each web site. One…
Vibration API
Lots of the new APIs supplied to us by browser distributors are extra focused towards the cell person than the desktop person. A type of easy APIs the Vibration API. The Vibration API permits builders to direct the system, utilizing JavaScript, to vibrate in…
HTML5’s placeholder Attribute
HTML5 has launched many options to the browser; some HTML-based, some within the type of JavaScript APIs, however all of them helpful. One among my favorites if the introduction of the
placeholderattribute to INPUT components. Theplaceholderattribute exhibits textual content in a subject till the…
