Como definir o tamanho do botão em HTML

Question

Como definir o tamanho do botão em HTML

Tenho alguns botões na minha página HTML/JS. Quando a página é aberta no navegador, o tamanho do botão é normal. Mas na página de actualização/recarga, o tamanho do botão é reduzido. Na verdade, eu não configurei o valor de texto do botão. O texto do botão está em branco. Como devo definir o tamanho do meu botão em HTML, independentemente do tamanho do texto?

18

html button

Author: Gab, 2014-07-29

Source

4 answers

score 36 · Answer 1

Queres dizer algo como isto?

HTML

<button class="test"></button>

CSS

.test{
    height:200px;
    width:200px;
}

Se quiser evitar o CSS , veja isto:

<button style="height:200px;width:200px"></button>

score 5 · Answer 2

Isto não pode ser feito com HTML/JS puros, você vai precisar de CSS

CSS:

button {
     width: 100%;
     height: 100%;
}

Substituir 100% com o tamanho necessário

Isto pode ser feito de muitas maneiras

score 4 · Answer 3

button { 
  width:1000px; 
}

Ou mesmo

 button { 
    width:1000px !important
 }

Se é isso que queres dizer ...

4

Author: ybdiel, 2014-08-26 12:57:44

score 0 · Answer 4

Se utilizar o seguinte HTML:

<button id="submit-button"></button>

O estilo pode ser aplicado através da JS usando o objecto de estilo disponível num HTMLElement.

Para definir a altura e a largura para 200px do botão de exemplo acima, este seria o JS:

var myButton = document.getElementById('submit-button');
myButton.style.height = '200px';
myButton.style.width= '200px';

Eu acredito que com este método, você não está escrevendo diretamente CSS (inline ou externo), mas usando JavaScript para alterar programaticamente declarações CSS.