Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá,
Estou com dificuldades em utilizar a propriedade float. E penso que não estou a fazer o uso correcto do positon.
Neste exemplo: https://jsfiddle.net/n9s031z2/
Pretendo que o conteúdo do nav e article dentro do section estejam lado a lado! Mas a partir do momento que aplico o a propriedade float - left e right, ele saem fora da tag section(borda verde) e main(borda vermelha). O que tem lógica, pois ficam a flutuar, um do lado esquerdo e outro do lado direito. Mas como consigo que eles fiquem no lado esquerdo e direito mas dentro da tag section e main.
Para auxiliar a explicação vejam as linhas verdes, que são as bordas do section e a linha vermelha que é a borda do main.
Penso que isto em haver com as propriedades position. Os valores de relative e absolute ainda não percebi bem! :/ Caso tenham algum artigo agradeço a partilha.
Obrigado e bons códigos
Obrigado pela resposta,
Funcionou, mas o que essa propriedade vai fazer é anular o transbordamento. Mas não consigo entender a lógica da "coisa" :P A tag section, local onde apliquei a propriedade, não está a transbordar, pelo contrário, nem sequer considera as tags nav e article...
Podem-me dar mais umas luzes? Obrigado
Outra forma de resolver essa questão é mudar o display do container onde estão os elementos com float (no seu caso o section) para inline-block.
Obrigado pelas ajudas, as duas opções funcionam mas com uma ligeira diferença no resultado da página! Mas para as perceber terei que estudar mais a fundo a propriedade display e overflow.
Obrigado e bons códigos
Com prática vai pegando o jeito :D
overflow:hidden nas divs que englobam as com propriedade float.