YUI Reset CSS Hace que <strong><em>esto no funciona</em></strong>

StackOverflow https://stackoverflow.com/questions/20107

  •  09-06-2019
  •  | 
  •  

Pregunta

Esta línea de YUI del Reset CSS está causando un problema para mí:

address,caption,cite,code,dfn,em,strong,th,var {
    font-style: normal;
    font-weight: normal;
}

Hace que mi em no en cursiva y mi strong no negrita.Lo cual está bien.Sé cómo reemplazar que en mi propia hoja de estilo.

strong, b 
{
  font-weight: bold;
}

em, i 
{
  font-style: italic;
}

El problema viene cuando he texto que es a la vez em y strong. 

<strong>This is bold, <em>and this is italic, but not bold</em></strong>

Mi regla para strong hace audaz, pero YUI la regla de em es normal de nuevo.¿Cómo puedo solucionar eso?

¿Fue útil?

Solución

Si su fuerte declaración viene después de YUI tuyo debe reemplazar.Usted puede forzar de esta manera:

strong, b, strong *, b * { font-weight: bold; }
em, i, em *, i * { font-style: italic; }

Si usted todavía compatible con IE7 tendrás que agregar !important.

strong, b, strong *, b * { font-weight: bold !important; }
em, i, em *, i * { font-style: italic !important; }

Esto funciona - ver por ti mismo:

/*YUI styles*/
address,caption,cite,code,dfn,em,strong,th,var {
  font-style: normal;
  font-weight: normal;
}
/*End YUI styles =*/

strong, b, strong *, b * {
  font-weight: bold;
}

em, i, em *, i * {
  font-style: italic;
}
 <strong>Bold</strong> - <em>Italic</em> - <strong>Bold and <em>Italic</em></strong>

Otros consejos

Me gustaría utilizar esta regla para reemplazar la de YUI reset:

strong, b, strong *, b *
{
  font-weight: bold;
}

em, i, em *, i *
{
  font-style: italic;
}

Si además de usar YUI reset.css, también puede usar YUI base.css, entonces usted va a ser todo el conjunto con un conjunto estándar de cruz del navegador de la base de los estilos.

ENLACE: http://developer.yahoo.com/yui/base/

He tenido un problema similar al que he añadido la de YUI Restablecer a la parte superior de mi stock archivo CSS.He encontrado que la mejor cosa para mí fue simplemente para eliminar todas las

font-weight: normal;

las declaraciones de los YUI Reset.Yo no he notado que esto ha afectado nada "cross-browser".

Todos mis declaraciones fueron después de la de YUI Restablecer así que no estoy seguro de por qué ellos no estaban tomando afectan.

Mientras sus estilos están cargados después de que el restablecimiento de aquellos a los que debe trabajar.¿Qué navegador es esto?porque yo trabajo en una manera similar a mí mismo y no he pegado a este problema me pregunto si es algo que en mi prueba de la culpa.

Restablecimiento de las hojas de estilo son los más utilizados como base.Si usted no desea restablecer em o fuerte, sacarlos de la hoja de estilos.

Como dijo Chris, usted no tiene que usar exactamente la misma CSS que proporcionan religiosamente.Acabo de guardar una copia en el servidor y editar a tus necesidades.

Yo sugeriría evitando todo lo que implica cortar el YUI archivos.Usted necesita ser capaz de actualizar las bibliotecas externas en el futuro y si su sitio se basa en las versiones editadas hay una buena posibilidad que se ladeó hacia arriba.Creo que esto es en general de buena práctica para la 3ª parte de la biblioteca de uso.

Así que pensé que este la respuesta estaba entre los mejores

Si además de usar YUI reset.css, también puede usar YUI base.css, entonces usted va a ser todo el conjunto con un conjunto estándar de cruz del navegador de la base de los estilos.

Yo veo lo que están diciendo.Supongo que se le puede agregar una regla CSS como este:

strong em { font-weight: bold; }

o:

strong * { font-weight: bold; }

Pensé que había una solución ideal:

strong, b 
{
  font-weight: bold;
  font-style: inherit;
}

em, i 
{
  font-style: italic;
  font-weight: inherit;
}

Por desgracia, Internet Explorer no es compatible con "heredar". :-(

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top