代码之家  ›  专栏  ›  技术社区  ›  Ashwin

使用display:table的HTML布局问题

  •  0
  • Ashwin  · 技术社区  · 12 年前

    我正在尝试使用 display:table, table-row 以获得如下的最终输出。蓝色框应可调整大小,红色框应具有固定高度。

    enter image description here

    启动一个jsbin是 here

    我正在寻找一个css解决方案。谢谢

    1 回复  |  直到 12 年前
        1
  •  1
  •   sandeep    12 年前

    它与 显示:表格 .这样写:

    #wrapper {height:250px; width:200px; border:3px solid gray; display:table;}
      #one {height:100px; background-color:red;display: table-row;}
      #two {background-color:blue;display: table-row;}
    

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