STYLE SWITCHER

HTML

CSS animations on demand – animista.net

CSS animations on demand –…

Animista is a library which allows users to create CSS animations online.

Maintain the aspect ratio of a div with CSS

Maintain the aspect ratio of…

In order to maintain the aspect ratio of a div with CSS create flexible elements that keep their aspect ratio (4:3, 16:9, etc.) when resize the browser window.

Fix SVG in <img> tags not scaling in IE9, IE10, IE11

Fix SVG in tags not…

IE9, IE10, and IE11 don't properly scale SVG files added with img tags when viewBox, width and height attributes are specified. View this codepen on the different browsers. Image heights will not scale when the…

CSS Filter

CSS Filter

CSS Filters are a powerful tool that authors can use to achieve varying visual effects (sort of like Photoshop filters for the browser). The CSS filter property provides access to effects like blur or color…

CSS Hacks Targeting Firefox

CSS Hacks Targeting Firefox

Firefox specific styling is now possible with CSS alone. No more JS hacks required.

IE10 stop scroll bar from appearing over content and disappearing

IE10 stop scroll bar from…

If you go to any website with content that causes a vertical scroll bar in ie10 (desktop). You'll notice that the scroll bar only appears when you hover over the window.

A simple example of CSS Variable

A simple example of CSS…

CSS variables, more accurately known as CSS custom properties, are landing in Chrome 49. CSS is going to be like a CSS pre-processor itself such as SASS, LESS in the future. CSS variables are now…

Differences Between Bootstrap 3 and 4

Differences Between Bootstrap 3 and…

Bootstrap 4 brought some major changes, adding new components, scrapping others. Here's the difference between Bootstrap 3 and Bootstrap 4.

Folder Preview Ideas using CSS and Javascript

Folder Preview Ideas using CSS…

Some ideas for previewing or just playing with folders on hover. The idea is to show a little animation when hovering a folder icon and reveal some kind of preview for what's inside.

  • Keep your skills sharp, get informed.

    Subscribe to our mailing list and get interesting stuff and updates to your email inbox