Hoe te maken: volledige breedte (blokse) knop

Leer hoe je de stijl van een volledige breedte (blokse) knop met CSS instelt.

Hoe een blokknop te stylen

Eerste stap - Voeg HTML toe:

<button type="button" class="block">Block Button</button>

Tweede stap - Voeg CSS toe:

Om een blokknop te maken, voeg 100% breedte toe en maak het een blokse element:

.block {
  display: block;
  width: 100%;
  border: none;
  background-color: #04AA6D;
  padding: 14px 28px;
  font-size: 16px;
  cursor: pointer;
  text-align: center;
}

Probeer het zelf

Gerelateerde pagina's

Handleiding:CSS knop