Стили как у button

#html #css #css3

Здравствуйте!
Ситуация следующая: 

Есть div. Нужно, чтоб он вёл себя с контентом внутри как кнопка. То есть, чтоб текст
и блоки внутри выравнивались по центру (по вертикали и горизонтали) и чтоб при изменении
размеров border не менялись внутренние и внешние размеры блока.

Вопрос может и глупый, но я в css ещё относительно новичёк, так что прошу вашей помощи.
    

Ответы

Ответ 1

.div_btn{
  width:150px;
  height:40px;
  background: tomato;
  display:flex;
  align-items:center;
  justify-content:center;
}

.div_btn a{
  text-transform:uppercase;
  font-size:14px;
  color:#fff;
  font-weight:900;
  font-family:sans-serif;
  text-decoration:none;
}

  Подробнее
  



Ответ 2

.button {
  box-sizing: padding-box;
  display: inline-block;
  padding: 12px 28px;
  background: yellow;
  border: 1px solid lightgray;
  color: black;
  border-radius: 4px;
  box-shadow: 0px 1px 10px 0px rgba(0,0,0,0.2);
  font-family: "Helvetica", "Roboto";
}

  
Моя кнопочка



Ответ 3

.btn {
    align-items: flex-start;
    width: 100%;
    max-width: 120px;
    text-align: center; 
    box-sizing: border-box;
    padding: 2px 6px 3px; 
    cursor:pointer;
    border:none; 
    background: #FFEB3B;
    outline: none !important;
    margin: 0em;
    font: 400 13.3333px Arial;
}
 
Кнопка