Viewing 6 replies - 1 through 6 (of 6 total)
  • Can you post a link to your site? It is very difficult to figure out how to fix the problem without being able to examine the site.

    Thread Starter nathair

    (@nathair)

    here is a test site to look at the code
    dorpsbelangenspijk.nl/test/test/
    childtheme with only color defined,

    @import url("../twentythirteen/style.css");
    
    /* =Theme customization starts here
    -------------------------------------------------------------- */
    .site-footer .sidebar-container {
        background-color: #262D34; /* was #220e10; */
    }

    The overlap is designed deliberately into the theme. If the height of the sidebar is less than the height of the content, then there is overlap. The top margin for the footer is dynamically calculated with a Javascript function depending up on the height of the content area. Overriding it is a bit complicated, because of the way the sidebar is positioned absolutely. Add this CSS to your child theme’s style.css file. The CSS is from this thread.

    .sidebar .entry-header, .sidebar .entry-content, .sidebar .entry-summary, .sidebar .entry-meta {
       padding: 0px 20px 0px 20px;
       max-width: 100%;
    }
    
    .sidebar .site-footer .widget-area {
        max-width: 1040px;
        left: 0px;
    }
    
    .hentry {
       padding: 20px 0px;
    }
    
    @media (min-width: 999px) {
    
       #main {
          overflow: hidden;
          margin: 0px auto;
          max-width: 1080px;
       } 
    
       #primary.content-area {
          width: 68%;
          float: left;
       }
    
       .site-main .sidebar-container {
          position: static;
          float: right;
          width: 30%;
          height: auto;
       }
       .site-main .widget-area {
          margin-top: 24px;
          margin-right: 20px;
       }
    
    }
    #colophon {
       margin-top: 0 !important;
    }

    Good catch @crouchingbruin!

    I took a look and was tying myself up in knots there. So I’ve learned something too.

    Hope it works for the OP

    Thread Starter nathair

    (@nathair)

    thank you @crouchingbruin
    I understand the original idea that the overlap is designed deliberately into the theme, but this for us is a good solution.
    Always learning,
    thank you!

    Thread Starter nathair

    (@nathair)

    with this solution there is now however something to set straight on the thumbnail images floating left getting cut of. I’ll work on that, instead of margin-left 60px it has to be something like

    .entry-content img.alignleft, .entry-content .wp-caption.alignleft {
        margin-left: -15px;
    }

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘sidebar dropping and overflowing into footer’ is closed to new replies.