1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Expandable div between two divs

Discussion in 'CSS' started by rdx65, Jul 10, 2010.

0
  1. #1
    I need to have 3 divs. Left, centre, right.
    I need to put an image in left and right divs and make centre div expandable.
    I have my divs like this:

    
left-div
{
width:230px;
float:left
height:110px;
}

right-div{
width;150px;
float:right;
height:110px;
}

centre-div
{
height:110px;
background-color:green;
margin-left:230px;
margin-right:150px;
}
    Code (markup):
    The problem is, when I decrease the window size, centre div falls below the left div.
    How can I make the centre div to shrink in width until some length is reached and after that there is no change in the divs when window width is shrinkin? Thanks
     
    rdx65, Jul 10, 2010 IP
  2. ktmfreelancer

    ktmfreelancer Greenhorn

    Messages:
    76
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    16
    #2
    yes, ofcourse it will fall down, because you haven't wrapped this 3 div's by another 1 more div on the top of it.
     
    ktmfreelancer, Jul 10, 2010 IP
  3. ktmfreelancer

    ktmfreelancer Greenhorn

    Messages:
    76
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    16
    #3
    put one more div above all this, with a fixed height to not let this fall down. the middle div according to your css won't work because you have fixed the height of the element.

    height:110px; change this to "min-height:110px;" and why there are margin-left and margin-right together in third div?
    this code wont be valid.
    anyways have a nice one buddy
     
    ktmfreelancer, Jul 10, 2010 IP