Category: CSS CheatSheets

Most often used CSS code examples.

Simple Form Labels Animation with CSS

Animate form labels easily, just with few lines of CSS.Continue reading

Posted in CSS CheatSheets | Tagged | Leave a comment

Transition Animation of CSS Gradient for background-clip: text

Animate background-clip text with CSS background on hover. Smooth.Continue reading

Posted in CSS CheatSheets | Leave a comment

Minimal CSS Styles for prettyPhoto RTL Lightbox inside Visual Composer Page Builder for WordPress

Minimal CSS styles to make prettyPhoto lightbox compatible with Right-toLeft languages. I didn’t change button positions here, it looks ok even so. Continue reading

Posted in CSS CheatSheets, WordPress | Tagged | 1 Comment

Google Chrome Web-Safe Font Issue Resolved

Just noticed that Google Chrome browser (version 67-68) is not displaying simple web-safe Verdana font for Hebrew texts on multilingual website. What could be wrong with Verdana?

Posted in Browsers Testing, CSS CheatSheets | Tagged | Leave a comment

Media Queries Based on Most Popular Screen Resolutions, 2015

Useful media queries based on most popular screen resolutions for desktops and laptops. Not including tablets and mobiles.Continue reading

Posted in CSS CheatSheets | Tagged | Leave a comment

Disable Input Number Field Arrows from CSS

Simple CSS code to remove ugly arrows from within input type number fields.Continue reading

Posted in CSS CheatSheets | Tagged | 6 Comments

CSS Transitions

Main points when dealing with CSS transitions and list of animatable properties.Continue reading

Posted in CSS CheatSheets | Tagged | Leave a comment

Making X Close Button Right and Without Images

Right basic font to make closing button cross light.Continue reading

Posted in CSS CheatSheets | Tagged | 1 Comment

Overflow-Wrap, Word Wrap and Hyphens Where Possible

Break words, add hyphens and explore the difference between word-break and word-wrap in CSS.Continue reading

Posted in CSS CheatSheets | Tagged | Leave a comment

Remove Spacing Between Inline-Block Elements

Remove additional padding between inline-block elements in CSS for i.e. unordered list in navigation. Continue reading

Posted in CSS CheatSheets | Tagged | 1 Comment

Remove Additional Line Spacing Added Because of <sup> Superscript HTML Tag

Superscript SUP HTML tag adds line spacing, so line spacing becomes not even. Simple CSS solution to make line spacing not dependent on SUP tags.Continue reading

Posted in CSS CheatSheets | Tagged | 1 Comment

How to Make Background Image to Cover Whole Browser Window

Make background image expand to 100% of browser’s window with this CSS code.Continue reading

Posted in CSS CheatSheets | Tagged | Leave a comment