Definir largura ou altura do elemento no modo Padrões

123

É possível definir a largura ou a altura do elemento HTML (por exemplo <div>) no JavaScript no modo Standards?

Observe o seguinte código:

<html>
<script language="javascript" type="text/javascript">
    function changeWidth(){
        var e1 = document.getElementById("e1");
        e1.style.width = 400;
    } 
</script>
<body>
    <input type="button" value="change width" onclick="changeWidth()"/>
    <div id="e1" style="width:20px;height:20px; background-color:#096"></div>
</body>
</html>

Quando o usuário pressiona o botão alterar largura , a <div>largura deve mudar.

Funciona bem quando a declaração doctype determina o Modo Quirks. No modo Standards, não consigo alterar o tamanho do elemento dessa maneira

É possível manipular o tamanho de um elemento no modo Standards? Como contornar essa disfuncionalidade?

javascript size standards element quirks-mode rafalry
fonte

Respostas:

191

Tente declarar a unidade de largura:

e1.style.width = "400px"; // width in PIXELS
Alexandre Perez
fonte
1
Ahaha .. eu quero dizer "miau" (c). Passei cerca de uma hora, tentando descobrir por que o estilo não é aplicado. Obrigado!
Vitalii Vasylenko
1
Vale ressaltar que a largura não inclui margens e, quando box-sizing: border-box;, a largura incluirá bordas, caso contrário, a largura não incluirá bordas.
Qian Chen
39

A stylepropriedade permite especificar valores para propriedades CSS.

A widthpropriedade CSS tem um comprimento como valor.

Comprimentos requerem unidades. No modo quirks, os navegadores tendem a assumir pixels se fornecidos com um número inteiro em vez de um comprimento. Especifique unidades.

e1.style.width = "400px";
Quentin
fonte