Home
advance css button maker
CSS Buttons Tools

advance css button maker

Dev

advance css button maker on GoojDex




Selected Button

Width

Height

px
Font Size

Color

Background Color

Border Style

Border Color

Border Width

Border Radius

Border Color

Border Top Color

Border Bottom Color

Border Left Color

Border Right Color

Border Style

Border Width

Measurment
Border Top Width

Border Bottom Width

Border Left Width

Border Right Width

Border Radius

Measurment
Border Top Right Radius

Border Top Left Radius

Border Bottom Right Radius

Border Bottom Left Radius

Padding

Button Alignment



.buttons-0{ 
width: 15%; 
height: auto; 
font-size: 15px; 
color: #ffffff; 
background-color: #8713d2; 
border-color: #ff00a0; 
border-width: 2px; 
border-top-right-radius: 0px; 
border-top-left-radius: 0px; 
border-bottom-right-radius: 0px; 
border-botttom-left-radius: 0px; 
padding: 5px; 

 } 
.buttons-0:hover {
width: 15%; 
height: auto; 
font-size: 15px; 
color: #ffffff; 
background-color: #342fc7; 
border-color: #ff00a0; 
border-width: 2px; 
border-top-right-radius: 0px; 
border-top-left-radius: 0px; 
border-bottom-right-radius: 0px; 
border-botttom-left-radius: 0px; 
padding: 5px; 

 } 
.buttons-0.active {
width: 15%; 
height: auto; 
font-size: 15px; 
color: #ffffff; 
background-color: #39c720; 
border-color: #ff00a0; 
border-width: 2px; 
border-top-right-radius: 0px; 
border-top-left-radius: 0px; 
border-bottom-right-radius: 0px; 
border-botttom-left-radius: 0px; 
padding: 5px; 

 } 

<div class="btn-align">
<button class="button-class">Button</button>
</div>
Powered by Dev Solutions

    Post a Comment