¿Por qué y cómo veinte y trece están agregando un margen superior a mi pie de página?

2

Estoy usando el tema veinte y trece con un tema infantil. Intenté resolver el infame problema de la barra lateral desbordante de esta manera: - Hizo flotar el contenido a la izquierda con un ancho fijo. - hizo que la barra lateral flotara a la derecha con un ancho fijo - agregue una clase de clearfix al div padre

Todo parece estar bien. PERO, por alguna razón, encuentro que el tema está agregando un margen superior a mi pie de página que parece ser igual a la diferencia entre la parte inferior de la barra lateral (div derecha) y la parte inferior del contenido de la entrada (div izquierda), por lo tanto, el valor del margen superior depende de qué página se muestra y es aleatorio (es decir, no es un valor en la hoja de estilo). Podría solucionar esto agregando un margin-top: 0 en la hoja de estilo pero realmente me gustaría entender qué está causando esto. Puede ver de lo que estoy hablando aquí: enlace Hay un margen superior de 641px en esta pagina!

<footer id="colophon" class="site-footer" role="contentinfo" style="margin-top: 641px;">

¿Sabes de dónde viene? K.

Editar: aquí está mi CSS personalizado:

.sidebar .entry-header, 
.sidebar .entry-content, 
.sidebar .entry-summary, 
.sidebar .entry-meta {
    max-width: 620px;
    padding: 0 20px 0 50px;
}

.site-main #primary {
    float: left;
    clear: none;
    width: 620px;
}

.site-main #tertiary {
    float: right;
    clear: none;
}

.site-main .sidebar-container {
    position: static;
    width: 300px;
    height: auto;
} 

.site-main .widget-area {
    padding: 30px 20px 0 0;
}
    
pregunta Kimberley Furson 07.02.2014 - 00:38

1 respuesta

4

Busque en el tema principal functions.js . Parece una implementación del concepto de "pie de página pegajoso". El margen se establece a través de script:

var body    = $( 'body' ),
    _window = $( window );

/**
 * Adds a top margin to the footer if the sidebar widget area is higher
 * than the rest of the page, to help the footer always visually clear
 * the sidebar.
 */
$( function() {
    if ( body.is( '.sidebar' ) ) {
        var sidebar   = $( '#secondary .widget-area' ),
            secondary = ( 0 == sidebar.length ) ? -40 : sidebar.height(),
            margin    = $( '#tertiary .widget-area' ).height() - $( '#content' ).height() - secondary;

        if ( margin > 0 && _window.innerWidth() > 999 )
            $( '#colophon' ).css( 'margin-top', margin + 'px' );
    }
} );
    
respondido por el helgatheviking 07.02.2014 - 01:06

Lea otras preguntas en las etiquetas