Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Aug 2008
    Location
    Northern Ireland
    Posts
    167
    Thanks
    12
    Thanked 6 Times in 6 Posts

    Question Floating Height Problem.

    Hey,

    This will be hard to explain as the site isn't somewhere where I can just link you up. But here is my problem. I have two divs inside a container div (CSS below) I need the left hand div to fill all the available space vertically as the container div can offer. The right hand div will always be at least slightly longer than the left hand div, so pretty much always dictates the height of the container.

    left hand div CSS

    Code:
    #MyPlace {
    	background-color: rgb(240,230,250);
    	padding:5px;
    	width:510px;
    	margin-left:10px;
    	height:100%;
    	float:left;
    }
    right hand div CSS

    Code:
    #RightColumn {
    	width:250px;
    	margin-left:10px;
    	margin-right:10px;
    	float:right;
    }
    container CSS

    Code:
    #Content {
    	padding: 5px 0;
    	margin-bottom:5px;
    	width:800px;
    	float:left;
    	border-bottom:2px dotted silver;
    }

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    You'd need to use faux-columns
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    Regular Coder
    Join Date
    Aug 2008
    Location
    Northern Ireland
    Posts
    167
    Thanks
    12
    Thanked 6 Times in 6 Posts
    I really hoped no one would say that! (or at least, that it wasn't the only option!) I don't really think this is a feasible option in this case (and sorry I should have stated this from the start) simply because the background will be changing based on user input, I really do need the entire div to be the same height as the longest div.

    Just thinking aloud here, but what about some Javascript that grabs the height of both divs, compares them, then sets both divs to be the same height as the largest value? I know this isn't the most accessible way of doing things, but this is an internal site where we can set the rules! How practical would this be?

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,865
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    I really hoped no one would say that! (or at least, that it wasn't the only option!) I don't really think this is a feasible option in this case (and sorry I should have stated this from the start) simply because the background will be changing based on user input, I really do need the entire div to be the same height as the longest div.
    Why didn't you say that before? lol
    See http://v3.thewatchmakerproject.com/j...ith-javascript
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    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
    •