www.webdeveloper.com
Results 1 to 4 of 4

Thread: issue with 100% heigt and positioning

  1. #1
    Join Date
    Feb 2010
    Location
    Netherlands
    Posts
    10

    issue with 100% heigt and positioning

    Hi,

    I have an issu with my css, I hope someone can help!

    I have a sidebar showing news and twitter messages.
    This sidebar has a background-color and 2 rounded corners.
    I want the height of the sidebar to grow if the rest of the page grows.
    But at the moment the side-bar has a float:right;
    and height:100%; doesn't seem to work on a floating div.
    If I give sidebar a position:relative; and a left:660px; without the floating, the height:100% works and the background of the sidebar does what I want.
    But then the content drops to below the content of the floating div next to it. Which - of course - I don't want.

    here's the link:
    http://www.hetpaddenstoelenhuis.nl/wordpress/

    Any advise?
    Thanks

  2. #2
    Join Date
    Sep 2008
    Location
    Akron, OH
    Posts
    1,111
    You'll want to spend some time Googling "equal height columns." Personally, I think your site looks fine with the shorter right column, so I'd leave it as is!

    http://matthewjamestaylor.com/blog/e...r-css-no-hacks
    I'm always up for networking with fellow web professionals. Connect with me on LinkedIn if you like!

  3. #3
    Join Date
    Feb 2010
    Location
    Netherlands
    Posts
    10
    thanks for the link, I'll check it out.

    And yes, so far it looks fine, but once the pages get filled, they might get a bit longer and that wil result in white 'gap' that i do not want...

  4. #4
    Join Date
    Feb 2010
    Location
    Netherlands
    Posts
    10
    THANKS, looks like that link is exactly what I need.
    (I haven't put it in my css yet, but it seems to be the answer I was looking for)

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles