首页 文章

当其他元素消失时,Div元素占用所有宽度

提问于
浏览
0

我创建了两个DIV元素 . 那些 two DIV elements 将只在一个页面中,而在所有其他页面中只有 one DIV element . 当第二个元素消失时,第一个元素自动占据所有宽度 . 对不起,我还无法添加图片,但我会尝试创建一个示例:

[div element“one”] width:50%[div element“two”] width:50%

  • div元素“two”消失

[div元素“one”]宽度100%

我怎么能这样?使用简单的CSS / HTML,我无法达到图像中的结果 . *我不能改变DIV元素的类

2 回答

  • 2

    像这样写:

    HTML

    <div class="two">two</div>
    <div class="one">one</div>
    

    CSS

    .two{
        background:red;
        float:right;
        width:50%;
    }
    .one{
        background:green;
        overflow:hidden;
    }
    

    检查这个http://jsfiddle.net/gJ22P/

    OR

    您可以使用 display:table 属性 .

    检查这个http://jsfiddle.net/gJ22P/1/

    这是IE8及以上版本的工作 .

  • 1

    您可以根据父容器类设置div的样式:

    第1页:

    <body class="twocolumn">
      <div id="div1">foo</div>
      <div id="div2">bar</div>
    </body>
    

    第2页:

    <body class="singlecolumn">
      <div id="div1">foo</div>
    </body>
    

    css文件:

    .twocolumn #div1 { width: 50%; }
    .singlecolumn #div1 { width: 100%; }
    #div2 {width: 50%; }
    

相关问题