Relleno de ser aplicados, sino en un valor diferente a lo que en el CSS

Tengo un enlace que se está aplicando para el logotipo en mis sitios de cabecera https://dev.theartofsongs.com/about. El problema que estoy teniendo es que el enlace ha de relleno a la derecha de lo que está empujando el logotipo de fuera del centro.

He cambiado el relleno en el CSS y aunque puedo ver que el estilo se ha aplicado en las herramientas de desarrollo, es ignorar el valor que he puesto en el CSS.

Archivo CSS

    #masthead .custom-logo-link {
        padding-right: 0em;
    }

HTML renderizado

    #masthead .custom-logo-link {
        padding-right: 2em;
    }

No entiendo por qué si se trata de solicitar el estilo es ignorar el valor de relleno

Edit: Acabo de actualizar a la gente sobre el por qué de este código no estaba funcionando en caso de que alguien más tiene esta característica en su servidor.

El código que yo había puesto en mi archivo CSS en realidad era correcta. Me volví y actualiza la página, varias horas después de que yo había subido mi código a través de ftp. De repente mi código de trabajo, incluso después de que me había vaciado la caché del navegador (yo tenía caché desactivada en herramientas de desarrollo de todos modos).

No pude averiguar por qué esto estaba sucediendo, pero esta mañana di cuenta de mi servidor tuvo un SuperCacher característica activada. Esencialmente, el servidor no estaba usando el archivo subido pero el archivo previamente en la caché. He desactivado la función de mi sitio de desarrollo y no he tenido más problemas.

Si alguien está teniendo problemas similares compruebe usted no tiene una característica similar en su servidor.

2 Respuestas

  • Santosh
    3 de mayo de 2019

    Es porque #masthead .site-branding .custom-logo-link tiene mayor especificidad que el selector se han utilizado en el archivo css. Intente utilizar importante

     #masthead .custom-logo-link {
        padding-right: 0em !important;
    }
    

    o utilizar de esta manera.

    #masthead .site-branding .custom-logo-link {
     padding-right: 0em;
    }
    
  • Dai Jie
    3 de mayo de 2019

    Debido a su otro estilo tiene una mayor especificidad.

    #masthead .site-branding .custom-logo-link {
        padding: 1em 0em;
    }
    

    Usted puede cambiar la especificidad con !importante

    #masthead .custom-logo-link {
        padding-right: 2em !important;
    }
    

    Para el cálculo de la especificidad, se puede ver la Especificidad de Documento