Como usar o Limpar Atributo de Controle de layout de página para HTML5 e CSS3 Programação

Deve haver alguma maneira de fazer o direito formulário de trabalho, independentemente da largura do recipiente. CSSS3 oferece exatamente um mecanismo de tal forma que é fácil trabalhar com ao projetar suas páginas HTML5.

o Claro atributo é utilizado em elementos com um flutuador atributo. o Claro atributo pode ser definido como esquerda, certo, ou ambos. Definir o Claro atribuir a esquerda significa que você não quer nada à esquerda deste elemento. Em outras palavras, o elemento deve ser na margem esquerda de seu recipiente. Cada etiqueta deve começar sua própria linha, para definir a sua Claro atribuir a esquerda.

Para forçar o botão para sua própria linha, defina sua Claro atribuir a ambos. Isto significa que o botão não deverá ter elementos para a esquerda ou para a direita. Ele deve ocupar uma linha própria.

Se você quer um elemento para iniciar uma nova linha, defina a sua flutuador e Claro atributos de esquerda. Se você quer um elemento para estar em uma linha só, definir flutuador para esquerda e Claro para ambos.

usando o Claro atributo permite que você tenha um recipiente flexível de largura e ainda manter o controle razoável do design do formulário. O formulário pode ser a mesma largura da página e ainda funcionar corretamente. Esta versão funciona, não importa a largura da página.

Aqui está o código CSS final, incluindo Claro atributos nos rótulos e botão:

/ * Arquivo floatForm.cssCSS para ir com formDemonstrates flutuador uso de float, largura, margem, e claro * / fieldset {background-color: # AAAAFF-} label {clear: left; float: left; width: 5em-text-align : right; margin-right: .5em-} entrada {float: left; background-color: # CCCCFF-} botão {float: left; clear: both-margem esquerda: 7em-margin-top: 1em-background-color : # 0000CC-color: # FFFFFF-}