Switch css with text

<style>/* Switch Slide==========================*/.switch-slide {	padding: 0;	margin: 15px 0 0;	background: #FFF;	border-radius: 0;	background-image: none;}.switch-slide .switch-label {	box-shadow: none;	background: none;	overflow: hidden;}.switch-slide .switch-label:after, .switch-slide .switch-label:before {	width: 100%;	height: 65%;	top: 5px;	left: 0;	text-align: center;	padding-top: 10%;	box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2), inset 0 0 3px rgba(0, 0, 0, 0.1);}.switch-slide .switch-label:after {	color: #FFFFFF;	background: #87CEEB;	left: -100px;}.switch-slide .switch-label:before {	background: #eceeef;}.switch-slide .switch-handle {	display: none;}.switch-slide .switch-input:checked ~ .switch-label {	background: #FFF;	border-color: #0088cc;}.switch-slide .switch-input:checked ~ .switch-label:before {	left: 100px;}.switch-slide .switch-input:checked ~ .switch-label:after {	left: 0;}</style>

Source: htmllion.com

Similar codes

1 vote156 views1 answer
Flexbox navbar fixed top
CSS
40 votes182 views6 answers
How to write css
CSS
55 votes153 views4 answers
Hover effects css
CSS
0 vote145 views1 answer
.sidebar { --offset: 2rem; flex-grow: 1; flex-basis: 300px; align-self: start; position: sticky; top: var(--offset); }
CSS
0 vote156 views1 answer
CSS Attribute Selector with role attribute
CSS
2 votes181 views1 answer
Material design css
CSS
1 vote149 views1 answer
Css reset margin padding
CSS
0 vote264 views1 answer
Top down gradient css on body
CSS
3 votes150 views3 answers
Css border left
CSS
0 vote148 views1 answer
Tipografias family style para css y html
CSS