Opa, dica rápida.
Edit 27/08/07 - Atenção: leia o post até o final onde está a solução do Chessman pois ela é a mais aconselhável.
Às vezes quando agente tá brincando com algum elemento ou pai de elemento que tem float: left ou display: table acontecem alguns bugs estranhos.
No Firefox, às vezes, o float não funciona quando se dá Control + F5, porém fica tudo beleza se você der um F5.
No Internet Explorer o pai do elemento simlesmente some. Vai entender.
Eu acredito que estas loucuras sejam bugs.
Aqui um exemplo de um cidadão com o problema.
Algumas soluções pra estas loucuras incluem um elemento fantasma (ou wrapper) no final da div pai com um clear both.
Outras sugerem colocar um display inline em quem tá com o float.
Eu vou entrar pro rol das soluções possíveis e tentar mostrar mais outra:
Tenta definir a largura e altura do elemento pai dos elementos com float.
Pode ser em porcentagem mesmo. Apenas defina. Se não der certo no pai dos floats, tente no avô dos floats também.
Aqui pra mim deu certo. Talvêz pra você dê certo também.
Edit: Uma perfecta (e inédita acredito eu) solução para este problema do bug foi feita pelo amigo de fórum senhor TheChessMan. Aqui o post onde ele desenvolveu inicialmente a solução. Parabéns chess.
Fui.
Gostou da dica acima? Então clica nos botões de compartilhamento abaixo e me ajude a dica a subir no Google.
Caraca isso aconteceu comigo essa semana e resolvi o problema de maneira diferente, quando precisava usar o float eu não podia usar position, o IEca implica com o position e float ao mesmo tempo, vai entender coisas de IEca. Mas como tinha partes do site que precisava usar position absolute, em vez de usar só uma div contendo float e position, usei duas divs o "avô" contendo o position e o "pai" contendo o float, e pronto problema resolvido.
ResponderExcluirfuiii...
Position relative para o elemento pai e até mesmo a remoção do background do elemento pai parecem resolver a questão.
ResponderExcluirEstou vendo essas informações no livro do Andy Buddc "Criando páginas web com css"
É, este problema é complicado.
ResponderExcluirDessa vez o FF não ajuda heheh.
Tem muita solução, é bom agente ter uma gama delas à disposição pra tentar quando o problema cair pragente heheh.
Valeu Tigo e Ramon.
Quer uma solução melhor?
ResponderExcluirhttp://www.quirksmode.org/css/clearing.html
Aqui ele muda a div que contém tudo:
div.container {
border: 1px solid #000000;
overflow: hidden;
width: 100%;
}
Pelo menos foi a única solução que encontrei que não me causou o famoso peek-a-boo bug do IE!!