Thread: css height help

    #1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2012
    Posts
    156
    Rep Power
    13

    css height help


    Hi

    I have been stuck for a while on this issue

    I have a main div with two divs inside it and am trying to get the main and inside divs to expand to fit the content in but am having no joy

    for example the home page does not have as much content as my sub page

    I have pasted the HTML and CSS below

    Code:
    <div id="container-pages">
       
       <div class="top-point">
       <img class="top-point" src="images/top-point-1.png" alt="" title="">
       </div>
    
    <div class="bottom-point">
       <img class="bottom-point" src="images/bottom-point-.png" alt="" title="">
       </div>
    
    </div>
    CSS

    Code:
    #container-pages {
    background: #598288;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    height: 835px;
    width: 957px;
    margin: 150px 21px 0 23px;
    }
    
    .top-point {
    margin: -92px 0 0 200px;
    }
    
    img.top-point {
    margin: -71.6px 0 0 182px;
    position: absolute;
    height: 80px;
    }
     
    .bottom-point {
    margin: 460px 0 0 200px;
    }
    
    img.bottom-point {
    margin: 54.6px 0 0 -440px;
    position: absolute;
    height: 80px;
    }
    Thank you in advance

    Kind regards

    Ian
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Oct 2009
    Location
    Nebraska, USA
    Posts
    876
    Rep Power
    275
    from the code you have posted I'm not completely understanding what you are trying to do.
    do you have an image of the layout you are trying to achieve, or maybe a link to the site/page, so, we can get an idea of the layout you are wanting?
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2014
    Posts
    10
    Rep Power
    0
    Could you explain or give an example ?
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jun 2014
    Posts
    28
    Rep Power
    0
    Try use the clearfix it may work well.
    clearfix:after {
    content: " "; /* Older browser do not support empty content */
    visibility: hidden;
    display: block;
    height: 0;
    clear: both;
    }

    Also give a trail to different width value.

IMN logo majestic logo threadwatch logo seochat tools logo