Extending sidebar widget with content

  • Does anyone know if there’s a way to make the height of your sidebar in the Twenty Twelve theme extend depending on the length of your content? So if the content on a particular page is longer, then the sidebar extends to that same length. My sidebar has a different background color than the background color of my content, so the difference in length is very noticeable.

    I’ve tried figuring this out myself in the CSS of my child theme for Twenty Twelve by trying this, where the height: 100%:

    .widget-area {
    background-color: #aeae6c;
    padding: 10px 10px 10px 10px;
    height: 100%;
    }

    However, it doesn’t work. Anyone have any ideas?

Viewing 2 replies - 1 through 2 (of 2 total)

  • You can use the display: table setting in CSS.

    Pen is here: https://codepen.io/83UnsungHeroes/pen/JbGqk

    Wrap both columns in a container to display: table;

    Both columns will then be display: table-cell;

    If you want to see how it works, take the display declaration out of the #right column CSS.

    Should add – doesn’t work before IE. *cough* Who cares? *cough*

    Thread Starter sleepy_daze

    (@sleepy_daze)

    Thanks! I see how this works, but I can’t get seem to get it to work with the Twenty Twelve theme… The link to the site I’m working with is here.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Extending sidebar widget with content’ is closed to new replies.