No elemento main, aparece o seguinte codigo css
main { width: 100%; padding-bottom: 0; float: none; }
Se eu tirar a propriedade float: none. A seção main fica preta, por quê?
Solucionado
No elemento main, aparece o seguinte codigo css
main { width: 100%; padding-bottom: 0; float: none; }
Se eu tirar a propriedade float: none. A seção main fica preta, por quê?
Alexandre, a sua sessão main tem algum float pré definido?
Se tiver algumas dúvidas com relação ao comportamento do float já antecipo esse excelente post do Marco Bruno :) https://medium.com/collabcode/pare-de-chutar-e-aprenda-como-funciona-o-float-left-e-float-right-e-sua-trupe-a4f4161114c7
Eu já entendo como funciona o float left e right. Mas não há uma menção no curso nem no artigo sobre o float: none. Eu pensava que se eu colocasse a pripriedate clear com o valor both, o problema seria resolvido, mas não.
O float none, só cancela algum float left ou right existente. Por padrão todos os elementos já tem ele, por isso ele em especifico não é abordado no curso.
O clear both, é para limpar o float de elementos anteriores a ele. Enquanto o float none trata do elemento que possui o float.
Nesse post que passei, tem exemplo trabalhando com diversos exemplos e casos de uso comuns dessas propriedades :)
Isso mesmo, em outro css mais genérico, existe o float: left para a tag main. Testando alguns valores, vi que a propriedade float com valor initial também resolve o problema, o que achei mais intuitivo que o float none, semanticamente,