WordPress.org

Forums

Help! Sidebar Length (6 posts)

  1. khlota
    Member
    Posted 6 years ago #

    I want my sidebars and content area to fill the space equally. I thought if I added 'height: 100%' to div#primary and div#secondary that those would be equal - and follow the length of the content section. Doesn't work. I also thought I could try this on div#left - which contains the sidebars, but that didn't work either. Any ideas?

    http://www.supportmyhabit.com

  2. esmi
    Forum Moderator
    Posted 6 years ago #

    In short - I don't think you can do it in that design as it stands. Sorry :-(

  3. stvwlf
    Member
    Posted 6 years ago #

  4. khlota
    Member
    Posted 6 years ago #

    ;( jQuery is yet again something I have no experience with but I shall set this aside to read for now and try to fix other issues. Thank you both.

  5. khlota
    Member
    Posted 6 years ago #

    Can I not put something in the sidebar.php - in either div#primary or div#secondary or both - after the last ul that makes the space? Course I tried this but it doesn't work for me but that doesn't mean it;s not possible ;-) It's my last stab at getting equal widget/sidebars before trying to figure out jQuery!

  6. stvwlf
    Member
    Posted 6 years ago #

    That is not the way that HTML or CSS work. There is no relationship between the two div's that represent the two different columns, thus neither is aware how long the other is. I've seen code that uses absolute positioning and percentages as a way to accomplish this, but those solutions seem to have side effects in some circumstances thus I don't use them.

    In the old days tables were used for this purpose as a table knows the max height of all its columns and sizes the whole thing accordingly - there is a relationship between the columns. Not so with two divs.

    There is another technique for doing what you want I forgot to mention before, called faux columns. It uses a background image that has the right side the same background as the sidebar column. It makes it look like the two columns are equal height even though they are not.
    http://www.alistapart.com/articles/fauxcolumns/

Topic Closed

This topic has been closed to new replies.

About this Topic