Matt Matt - 4 days ago 6
CSS Question

Cannot fix CSS of a button,

Well this is the input I am trying to draw

Button that has to be made:

enter image description here

And this here is my work! Cannot perfectly replicate it! Can anyone help?

HTML:

<input type="submit" class="abc" />


CSS:

.abc
{
background: #ffad1f none repeat scroll 0 0;
color: #ffffff;
display: inline;
font-size: 13px;
font-weight: 500;
line-height: 30px;
margin: 0;
padding: 7px 10px;
position: relative;
text-align: center;
text-transform: uppercase;
z-index: 1;
}


https://jsfiddle.net/3wsmsh3L/

Answer

Maybe helpfully:

set border to 0 and modify line-height

.abc {
  background: #ffad1f none repeat scroll 0 0;
  color: #ffffff;
  display: inline;
  font-size: 13px;
  font-weight: 500;
  line-height: 16px;
  margin: 0;
  padding: 7px 10px;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  z-index: 1;
  border: 0;
}
Comments