html – 在不破坏布局的情况下将div与底部对齐

我想在这里将条形对齐到底部：http://jsfiddle.net/7vdLV/67/

我尝试使用以下技巧：

  .graph { position: relative; }
  .weekbar { position: absolute; bottom: 0; left: 0; }

然而它打破了图表,在这种情况下,有人能告诉我应该怎么做吗？

最佳答案

最简单的解决方案

应用

.weekbar{
 position:relative;
 display:inline-block;
 top:50%; // height of biggest bar
}

检查这个JSFiddle

或者,如果古老的浏览器支持不是很重要,您可以使用:: before元素,如下所示：

.graph::before{
 content:"";
 display:block;
 height:50%; // height of the biggest bar 
}
.weekbar{
 display:inline-block;
}

检查这个JSFiddle