El espacio en blanco de CSS y la imagen de estilo de lista no se acumulan en Firefox 11+

Tengo una tabla, y cuando hago clic en una de las columnas principales, los datos se ordenan respectivamente. Cuando se hace clic en la columna, aparece una flecha antes del nombre de la columna (que es la imagen de estilo de línea). Cuando el nombre de la columna es demasiado largo y se hace clic en la columna para ordenarla, de modo que tenga una viñeta de imagen, las imágenes van por encima del texto, cuando el white-space: normal Está establecido. Esto es lo que espero. Esto es lo que sucede en Chrome e IE, pero no es el caso en Firefox v11+. En Firefox, la flecha de la imagen va más allá de los límites de la <th> delante del texto. ¿Alguna sugerencia para hacer que esto funcione en Firefox como en Chrome e IE?

Aquí hay una muestra:
HTML

<table class="tableCustom" cellspacing="0" cellpadding="0" border="0">
    <thead>
        <tr>
            <th class="tableValue sorting_asc">
                <ul>
                    <li>Some unnecesseary long Column Name</li>
                </ul>
            </th>
        </tr>
    </thead>
</table>


CO

th.tableValue {
    background-color: #8DA7BE;
}

th, th.tableValue {
    background-position: center top;
    background-repeat: repeat-x;
    border: 1px solid #8DA7BD;
    color: #FFFFFF;
    font-size: 9pt;
    height: 33px;
    padding-left: 2px;
    padding-right: 2px;
    text-align: center;
    white-space: normal;
}

.tableValue {
    color: #728DAB;
    text-align: center;
    white-space: normal;
    width: 100px;
}

.sorting_asc {
    list-style-image: url("../img/sort-asc.gif");
    list-style-position: inside;
    list-style-type: inherit;
}

preguntado el 12 de junio de 12 a las 12:06

Por favor, publique un violín con una imagen de flecha:

1 Respuestas

¿Estás usando algún reset.css? Que no .

Aquí puede encontrar muchos enlaces para reset.css.

Si el problema persiste, proporcione un jsviolín

Editar::: La razón para usar reset.css es porque hará que todos los css del agente de usuario (navegador) tengan una configuración básica, para que no se vean diferentes en diferentes navegadores.

contestado el 23 de mayo de 17 a las 13:05

Gracias, no uso reset.css. Lo intentaré. Traté de proporcionar un jsFiddle pero debido a las muchas dependencias fue bastante imposible en este caso. - nyxz

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.