Elements

Buttons


				
HTML
<a href="#" class="button -button-0">     <p>BUTTON</p> </a>
RESULT

BUTTON


				
HTML
<a href="#" class="button -button-1">     <p>BUTTON</p> </a>
				
CSS
/* Button 1 */ .-button-1::before {     background: red; }
RESULT

BUTTON


			
HTML
<a href="#" class="button -button-2">     <p>BUTTON</p> </a>
			
CSS
/* Button 2 */ .-button-2::before {     background: DarkViolet; } .-button-2 p {     color: white; } .-button-2:hover::before {     background: DeepPink; } .-button-2:hover p {     color: white; }
RESULT

BUTTON


				
HTML
<a href="#" class="button -button-3">     <p>BUTTON</p> </a>
				
CSS
/* Button 3 */ .-button-3::before {     background-color: transparent;     border: 3px solid red; } .-button-3 p {     color: red; }
RESULT

BUTTON


				
HTML
<a href="#" class="button -button-4">     <p>BUTTON</p> </a>
				
CSS
/* Button 4 */ .-button-4::before {     background-color: transparent;     border: 3px solid red; } .-button-4 p {     color: red; }
RESULT

BUTTON


				
HTML
<div class="-buttons-inline">     <a href="#" class="button -button-5">        <p>BUTTON</p>     </a>     <a href="#" class="button -button-6">        <p>BUTTON</p>     </a> </div>
				
CSS
/* Button 5 */ .-button-5::before {     background: red; } .-button-5 p {     color: white; } /* Button 6 */ .-button-6::before {     background-color: transparent;     border: 3px solid red; } .-button-6 p {     color: red; }
RESULT

				
HTML
<div class="-buttons-inline">    <a href="#" class="button -button-7 -pulls-right">       <p>BUTTON</p>    </a>    <a href="#" class="button -button-8">       <p>BUTTON</p>    </a> </div>
				
CSS
/* Button 7 */ .-button-7::before {     background: transparent;     border: 3px solid red; } .-button-7:hover::before {     background: FireBrick ;     border: 3px solid FireBrick ;     width: 93%;     height: 93%; } .-button-7:hover p {     color:white; } .-button-7 p {     color: red; } /* Button 8 */ .-button-8::before {     background-color: red; } .-button-8 p {     color: white; }
RESULT