WordPress.org

Support

Support » Themes and Templates » Sidebar height problem

Sidebar height problem

  • danny_getextra

    @danny_getextra

    Hi,

    I’m trying to extend the second sidebar underneath the product navigation to stretch the whole content page.

    However i only seem to be able to set it a fixed sized to make it appear. I’ve tried height:100%; and auto but they don’t seem to work.

    .underside {
    position:relative;
    height:100%;
    width:200px;
    float:left;
    background: url("http://www.askas.co.uk/wp-content/uploads/2012/11/underside.jpg") repeat-y;
    
    }
    
    #products_page ul.categories {
        float: left;
        width:200px;
        margin:0;
        padding:0;
        list-style: none;
        text-transform: uppercase
        height:100%;

    webpage im working on -> http://www.askas.co.uk/products/footwear/

Viewing 4 replies - 1 through 4 (of 4 total)
  • WPyogi

    @wpyogi

    Forum Moderator

    That’s a well-known issue with floated columns — elements only extend as far as there is content — unless it’s a fixed height (and with dynamic content, that’s not generally possible). There are a few CSS work-arounds — one of which is to make the side column a sidebar and make the background color the same as what’s in the menu area.

    Google around and you’ll find many discussions of how to deal with it.

    Moderator Andrew Nevins

    @anevins

    You won’t be able to with that invalid markup.
    You can’t have this structure;

    <ul>
     <li> ... </li>
     <li> ... </li>
     ...
     <div class="underside"></div>
    </ul>

    I don’t know what the purpose of the underside is for, but if you just want the underside’s background colour expanded to the bottom of the main content, remove that <div class="underside"></div>. Then apply that background colour (actually an image) to the <ul> in that sidebar.

    You then need to restructure your HTML some more by putting the sidebar within <div class="products"></div>. This one of other steps to ensure your sidebar expands with the content.

    danny_getextra

    @danny_getextra

    Moderator Andrew Nevins

    @anevins

    This level of support is not provided by WordPress.org forums, consider a CSS-specific forum or hiring someone.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Sidebar height problem’ is closed to new replies.
Skip to toolbar