CSS Hacks – text un-selectable

 make text unselectable CSS

Code

1 2 3 4

-webkit-user-select: none; /* Safari */        -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* IE10+/Edge */ user-select: none; /* Standard */

1 2 3 4 5 6 7 8 9

.noselect {   -webkit-touch-callout: none; /* iOS Safari */     -webkit-user-select: none; /* Safari */      -khtml-user-select: none; /* Konqueror HTML */        -moz-user-select: none; /* Old versions of Firefox */         -ms-user-select: none; /* Internet Explorer/Edge */             user-select: none; /* Non-prefixed version, currently                                   supported by Chrome, Edge, Opera and Firefox */ }

1 2 3

input {       pointer-events:none;     }

Read More

CSS Hacks – text not highlightable

 how to make text not highlightable CSS

Code

1 2 3 4

-webkit-user-select: none; /* Safari */        -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* IE10+/Edge */ user-select: none; /* Standard */

Read More

CSS Hack – Background image fit

 Code

Background image fit

1 2 3 4 5 6

body {     background-image:    url(images/mybackground.svg);     background-size:     cover;                      /* <------ */     background-repeat:   no-repeat;     background-position: center center;              /* optional, center the image */ }

Background image cover

1 2 3 4 5 6 7

html {   background: url(images/mybg.jpg) no-repeat center center fixed;   -webkit-background-size: cover;   -moz-background-size: cover;   -o-background-size: cover;   background-size: cover; }

Background image size

1 2 3 4 5 6 7 8 9 10 11

.example1 {   background: url(bg.jpg);   background-repeat: no-repeat;   background-size: auto; }   #example2 {   background: url(bg1.jpg);   background-repeat: no-repeat;   background-size: 300px 100px; }

Cover full image

1 2 3 4 5

body {   background-position: center;   background-repeat: no-repeat;   background-size: cover; }

Read More