dynamic width div question

Discussion in 'CSS' started by durgesh871, Jun 30, 2010.

  1. #1
    i have 3 divs and need them to display like this:

    div1 at the very left with an unknown width
    div2 at the very right with an unknown width
    and div3 in the middle filling up the space between div1 and div2, which means it's width is also unknown

    how do i achieve this?

    thanks in advance
     
    durgesh871, Jun 30, 2010 IP
  2. Master_Seller

    Master_Seller Well-Known Member

    Messages:
    731
    Likes Received:
    15
    Best Answers:
    0
    Trophy Points:
    110
    #2
    You can achieve that using percentage. The width cannot be completely unkown. It need to base on some standard like in percentagewise. Let say you want your left and right DIV of same size and middle DIV will be double of left/right DIV.

    So your Left DIV = 25% and Right = 25% and Middle = 50%. So the total comes to 100%.

    Now the width of the div will change according to the Visitors Monitor Resolution.

    Let's say Visitor with Monitor Resolution of 1024 x 768 Resolution will see Left DIV of 256px(1024 x 25/100) and Right DIV of 256px(1024 x 25/100) and Middle DIV of 512px(1024 x 50/100). So the total comes to 1024px which is 100%.

    Similarly the DIV will increase if the visitor is using higher resolution monitor.
     
    Master_Seller, Jun 30, 2010 IP