CSS one div with liquid width next to a floating div that may or may not exist

I have already read this question but I can’t get my head to work a solution that fits my needs, because my situation is a bit different and because I am not very good at CSS.

What I have is a div containing three other divs:

  • div1 on the left
  • div2 centered
  • div3 on the right

The problem is that div2 may or may not exist.

This is what I currently have:

But this is what I want:

Here is my Fiddle

Any ideas? Thanks!

Problem courtesy of: John Shepard

Solution

#div3{
display:block;
background: #CCC;
overflow: hidden;
}

http://jsfiddle.net/5xgwz/17/

Solution courtesy of: Monokh

Discussion

Hi i think you want this

Please remove to width of #container

as like this

#container {

    padding: 5px;
}

and over-right properties to this #div3 as like this

#div3{
    display:block;
    background: #CCC;
    overflow: hidden;
}

Now Live demo is http://jsfiddle.net/5xgwz/20/

Discussion courtesy of: Rohit Azad

just add overflow:auto; in your div3’s css that will work

Discussion courtesy of: Neji

check this http://jsfiddle.net/geQqG/16/ and then just copy this code and paste in your dreamweaver and run with firefox browser……

Discussion courtesy of: Karthi Shan

This recipe can be found in it’s original form on Stack Over Flow .

稿源:CSS3 Recipes (源链) | 关于 | 阅读提示

本站遵循[CC BY-NC-SA 4.0]。如您有版权、意见投诉等问题,请通过eMail联系我们处理。
酷辣虫 » 前端开发 » CSS one div with liquid width next to a floating div that may or may not exist

喜欢 (0)or分享给?

专业 x 专注 x 聚合 x 分享 CC BY-NC-SA 4.0

使用声明 | 英豪名录