Please enable JavaScript.
Coggle requires JavaScript to display documents.
Page Layouts - Fundamentos (Elementos Floats (O Float tem duas direções e…
Page Layouts - Fundamentos
Calculando larguras em EM
Qual a diferença entre pixel, em e percentual?
em = px x 10 ou % / 10
1em = 10px ou 1em = 100%
percentual = px x 100 ou em x 10
10px = 100% ou 1em = 100%
Calculando larguras em percentual
São layouts fluídos, isto é, ele não fica fixo por um layout definido por largura específica.
10px = 100% e 1em = 100%
Elementos Floats
O Float tem duas direções e mais outras propriedades. Essas direções são left e right(esquerda e direita) e são as mais utilizadas.
O Float: none que é nenhuma flutuação.
Float: inherit que vai herdar a flutuação do elemento pai.
Compreender o Clear
O clear ele limpa, ou seja se você não quer nada a sua direita basta usar o clear:right e se tiver alguma coisa a sua direta, o seu elemento irá descer e ficar sem nada a sua direita.
Clear right, o elemento não terá nada a sua direita.
Clear left o elemento não terá nada a sua esquerda.
Clear both, o elemento não terá nada a direito ou a esquerda dele.
Controlando elementos com overflow
Com o overflow você pode corrigir o erro de quando o elemento pai perde sua altura quando os elementos filhos flutuam.
E para isso basta ir no elemento pai e coloca Overflow: Hidden.
Elementos com float inline
Para mudar apenas a primeira letra de um parágrafo, basta você adicionar:
p:first-of-type:first-letter