100% vertically expanding div

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • clain
    New Member
    • Feb 2007
    • 79
    #1

    100% vertically expanding div

    Do you guys know how to make a div expand vertically 100%..

    i do have a solution with Javascript.. but its not the right way. any CSS tricks will be helpful..

    also many such tricks works in IE just like giving 100% height to body..etc..

    i need a FF and IE compatible one..

    any wild guess.
    Tags: div, div expansion verticaly, vertical expanding div
    • drhowarddrfine
      Recognized Expert Expert
      • Sep 2006
      • 7434
      #2
      Originally posted by clain
      also many such tricks works in IE just like giving 100% height to body..etc..

      i need a FF and IE compatible one..

      any wild guess.
      No wild guesses. Just like you said, give the body and your div a height of 100%. Works every time.

        Comment

        • clain
          New Member
          • Feb 2007
          • 79
          #3
          no buddy that one did not work in Firefox...!!!! its OK with IE....

            Comment

            • KevinADC
              Recognized Expert Specialist
              • Jan 2007
              • 4092
              #4
              can you show what you have tried, like:

              Code:
              <div style="height:100%;border:solid;">some content</div>

                Comment

                • drhowarddrfine
                  Recognized Expert Expert
                  • Sep 2006
                  • 7434
                  #5
                  Yes because I question what your other markup is. I use Firefox exclusively and that particular snippet I use frequently. Testing in my Windows notebook shows it works in IE and FF.

                    Comment

                    • clain
                      New Member
                      • Feb 2007
                      • 79
                      #6
                      Code:
                      <body style="height:100%;" >
<center>
<div class="bg">

some content
</div>
</center>
</body>
                      and here is the class bg

                      Code:
                      .bg
{
width:955px;
background:url(../images/mainbg.gif) repeat-y; 
height:100%;
}

                        Comment

                        • drhowarddrfine
                          Recognized Expert Expert
                          • Sep 2006
                          • 7434
                          #7
                          That should be working but I'm heading to the airport.

                            Comment

                            • clain
                              New Member
                              • Feb 2007
                              • 79
                              #8
                              do i have something to do with airport dude? ha ha .... anyway.... i'm just wandering and pondering with the problem

                                Comment

                                Previous template Next
                                Working...