Menu CSS quebrado no Firefox (display: table-cell;)
-
03-07-2019 - |
Pergunta
HTML:
<td align="center" width="100%">
<a class="Forum_ib_moderate" href="Default.aspx" title="Moderate"></a>
<a class="Forum_ib_admin" href="Default.aspx" title="Admin"></a>
...
CSS:
A.Forum_ib_moderate:link, A.Forum_ib_moderate:visited, A.Forum_ib_moderate:active, A.Forum_ib_moderate:hover
{
background-image: url(images/ib_moderate.png);
background-repeat: no-repeat;
background-position: center;
padding-left: 2px;
padding-right: 2px;
padding-top: 8px;
padding-bottom: 0px;
height: 35px;
width: 35px;
display:table-cell;
}
A.Forum_ib_admin:hover
{
background-image: url(images/ib_admin_hover.png);
}
no menu parece muito bem no IE, aparece vertical no Firefox. Se eu desligar "display: table-cell"; estilo no Firebug e depois ligá-lo novamente, ele corrige esse nó menu.
todas as idéias?
P.S .: eu não quero mexer com o próprio menu, já que é uma parte de um Fórum DNN 4.4.3. Eu prefiro corrigir o CSS para torná-lo mostrar corretamente.
Solução
Na verdade, eu acho que você verá que o IE funciona porque ele ignora display: table-cell
. Display: table-cell
é, na verdade você está problema.
O que eu estou supondo que está acontecendo é que o IE está revertendo aqueles a ser elemento inline, portanto horizontal.
mude para:
display: inline;
adicionar algum estofamento (esquerda e direita) conforme necessário e você vai conseguir o que deseja.
Como alternativa, você pode flutuar-los (à esquerda e / ou direita).
Besdies, eles já estão em uma célula da tabela. exibição célula tabela dentro que é um pouco errado.
Outras dicas
Nós executar para esse problema também. Ainda procurando por uma solução. No nosso caso, precisamos manter display:. Layout célula da tabela
Parece Firefox, por vezes, e aparentemente de forma aleatória, fará com que objetos de células da tabela para embrulhar em vez de agir como uma tabela real. Uma atualização resolve o problema, o que só faz com que seja mais difícil de correção de bug.
Parece ser uma simples FireFox bug. Eu encontrei o problema o contrário: Os DIVs com table-cell dispostos abaixo do outro após a atualização em FF 3.5.9 no Win XP
.Eu não era capaz de não encontrar qualquer solução (embrulhar as células em uma linha, estouro oculto, etc), mas para atualizar o Firefox para 3.6.3 e espero há poucos usuários com essa versão.
Este sons semelhantes a um bug refluxo firefox que eu estou tentando consertar bem. Aparentemente mesas são realmente ruim para processamento, uma vez que causam um refluxo e parece que o Firefox às vezes perde os reembolsos.
Eu encontrei as seguintes páginas para ser útil: