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
    Senior Coder
    Join Date
    Jun 2008
    Location
    New Jersey
    Posts
    2,536
    Thanks
    45
    Thanked 259 Times in 256 Posts

    Get div to fit content

    I have a div in which I have a number of floated divs, creating a number of rows within. The way its setup (using a few clears to arrange the layout the way I want), with height of the parent is up to the top of the last row, and expands the entire width of the page (as expected).

    I'm trying to figure out if there is a way to get the div to fit exactly the content that's within it. Because of the way its setup, I can calculate the height/width (the number of rows and their width are determined by the user) and give the parent div a hard set height/width, but that's adding a step I'd rather avoid.

    Anyone know of a way to get the div, given it has floading divs within it, to fit the content? Or am I going to have to hard code it?

    Small note, I am aware of using a clear: both at the bottom to have the vertical content fit (if just slightly over), but I'm not aware of that fixing the horizontal fit, and I'm more curious if there is a method of getting an exact/nearly exact fit, rather then a close fit.
    Last edited by Keleth; 08-04-2011 at 11:58 PM.

  • #2
    Regular Coder Lerura's Avatar
    Join Date
    Aug 2005
    Location
    Denmark
    Posts
    946
    Thanks
    0
    Thanked 129 Times in 128 Posts
    You can just float the container div too, to make it fit the width of the content
    setting no height, will make the div fit the height.

  • Users who have thanked Lerura for this post:

    Keleth (08-05-2011)

  • #3
    Senior Coder alykins's Avatar
    Join Date
    Apr 2011
    Posts
    1,758
    Thanks
    41
    Thanked 191 Times in 190 Posts
    if u remove all height attributes it will by default expand to fit around it's children. until there is content the divs will be 0px high though... you may want to give everything a "hard-coded" height of something using the min-height property to assist you visually in coding

    I code C hash-tag .Net
    Reference: W3C W3CWiki .Net Lib
    Validate: html CSS
    Debug: Chrome FireFox IE

  • #4
    Senior Coder
    Join Date
    Jun 2008
    Location
    New Jersey
    Posts
    2,536
    Thanks
    45
    Thanked 259 Times in 256 Posts
    Quote Originally Posted by lerura View Post
    You can just float the container div too, to make it fit the width of the content
    setting no height, will make the div fit the height.
    I.... I can't believe I never tried a float within a float... that's crazy!

    Thanks man, works perfectly, or so it seems I take all browsers will take it that way? I guess, to the testing!


  •  

    Posting Permissions

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