Flutuadores bagunçando nos navegadores Safari
Pergunta
Eu tenho um site que fiz muito rápido e que usa carros flutuantes para exibir diferentes seções de conteúdo.O conteúdo flutuante e o conteúdo que tem uma margem adicional aparecem bem no FF/IE, mas no safari um dos divs fica completamente oculto.Eu tentei mudar para padding
e position:relative
, mas nada funcionou para mim.Se eu retirar o código para exibi-lo à direita, ele aparecerá novamente, mas sob o conteúdo flutuante.
A seção principal do CSS que parece estar causando o problema é:
#settings{
float:left;
}
#right_content{
margin-top:20px;
margin-left:440px;
width:400px;
}
Isso me dá o mesmo resultado, independentemente de eu especificar um tamanho para a div #settings ou não.Qualquer idéia seria apreciada.
O site está disponível em: http://frickinsweet.com/tools/Theme.mvc.aspx para ver o código-fonte.
Solução
Acredito que o erro esteja na marcação que o seletor de cores está gerando.Salvei a página e removi o código do seletor de cores e ele ficou bem no IE/FF/SF.
Outras dicas
Você já tentou flutuar a div #right_content para a direita?
#right_content{
float: right;
margin-top: 20px;
width: 400px;
}
Desculpe, eu deveria ter mencionado isso também.Tentei flutuar o conteúdo para a direita e, adicionalmente, tentei flutuá-lo para a esquerda e definir a posição pensando que ambos os divs começariam em left:0, onde definir a margem à direita o moveria.
Obrigado
Algumas coisas que você deve corrigir de antemão:
- Seu
<style>
a etiqueta está em<body>
, quando pertence<head>
Você cometeu um erro de digitação "real" em um de seus estilos embutidos:
<a href="http://feeds.feedburner.com/ryanlanciaux" style="position:realtive; top:-6px;">
Tente fazer com que sua página validar;isso deve facilitar muito a depuração dos problemas reais.