SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Thread: Height Issue

  1. #1
    SitePoint Evangelist klik's Avatar
    Join Date
    Jan 2005
    Location
    Scotland, UK
    Posts
    547
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Height Issue

    http://www.reaction2music.com/

    The main right hand column, I want the background to drop all the way down the same level as the left column. The left column will be of varying lengths on all pages so both columns should adjust to line up immediately under the content.

    At the moment, the left hand column does this, but the right hand column doesn't.

    Any thoughts?

    CSS file can be found at http://www.reaction2music.com/css/r2m.css

    Thanks

  2. #2
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,122
    Mentioned
    29 Post(s)
    Tagged
    2 Thread(s)
    Hello,

    Fake the 100% column using a background color, borders and a negative margin:
    Code:
    #wrapper {
      position: relative;
      width: 760px;
      margin-right:auto;
      margin-left:auto;
      background: #E5E5E5;
      margin-bottom: 2px;
      height: 100%;
    }
    #music-content {
      overflow: hidden;
      width: 500px;
      float: left;
      margin: 0px;
      background-color: #E5E5E5;
      border-right: 1px solid #000;
    }
    #news-content {
      width: 259px;
      overflow: hidden;
      float: left;
      margin: 0;
      border-left:1px solid #545454;
      background: #E5E5E5;
      margin-left: -1px
    }
    So now both columns have a 1px border at their edge and we use a negative margin to drag the borders on top of one another.

    Hope it helps


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
  •