SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Thread: css high

  1. #1
    SitePoint Addict sorin21us's Avatar
    Join Date
    Mar 2009
    Posts
    279
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    css high

    I want to make the same high, from top to bottom, for those two sidebars from right. I forgot what css rule to use in this case.
    The website is http://www.aproapetot.ro/index.php.
    Please, anybody can tell me how to do it?

  2. #2
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,521
    Mentioned
    61 Post(s)
    Tagged
    2 Thread(s)
    Do you want all three columns to be the same height, or just the two on the right?

  3. #3
    SitePoint Addict sorin21us's Avatar
    Join Date
    Mar 2009
    Posts
    279
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, I want all 3 to be from the top to the bottom.

  4. #4
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,521
    Mentioned
    61 Post(s)
    Tagged
    2 Thread(s)
    You can try something like this and see if you like it. If you don't, there are other ways of doing this, but this is the easiest. It works in IE8+.

    To test this, paste it just above the </head> tag. If you're OK with it, you can fit it into your CSS.
    Code:
        <style type="text/css">
    #page-bg {
        display:table;
        table-layout:fixed;
        border-spacing:0;
        width:1200px;
        padding:0;
        margin:0 auto;
    }
    #content,
    #sidebar1,
    #sidebar2 {
        float:none;
        display:table-cell;
        vertical-align:top;
        border-left:0;
        border-right:2px solid #aaa;
    }
    #content {
        width:auto;
        padding:30px 40px 30px 10px;
    }
    #sidebar1,
    #sidebar2 {
        width:212px;  /* 212 + 8 = 230px */
        padding:0;
        padding:8px;
    }
        </style>

  5. #5
    SitePoint Addict sorin21us's Avatar
    Join Date
    Mar 2009
    Posts
    279
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The code works, but I'm curious if works in IE before ver 8 and other browsers. Thank you for your effort.

  6. #6
    SitePoint Mentor bronze trophy
    ronpat's Avatar
    Join Date
    Jun 2012
    Location
    NJ, USA
    Posts
    2,521
    Mentioned
    61 Post(s)
    Tagged
    2 Thread(s)
    As I mentioned in my post, it works in IE8+, not IE7-.

    http://caniuse.com/#feat=css-table


    If you really need to support IE7, you can use a faux column technique in which a background image simulates full height columns.

    http://www.pmob.co.uk/temp/three-equal-divs-bg.htm


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •