垂直对齐的div里面另一个 - 问题 [英] vertical alignment of div inside another - issue

问题描述

我原本有浮动div，我想要在这些浮动内容垂直对齐。

这是给我的麻烦，所以我不得不删除浮动。

我发现这个小提琴此帖子。

并使用小提琴来获得所需的布局。

我试过，

  vertical-align：middle; 
 display：table-cell; 
  

对于 parent 容器和

  display：inline-block; 
  

1）在此小提琴中。我想让 right 在 right-container 中垂直对齐。

换句话说。我想在主div 中有两个div 垂直对齐，两个div中的div都需要垂直alined。

2）如何实现浮动内部的垂直对齐？所以我不能改变我的原始布局。在右撇子和左撇子处说出浮动。

需要一些指针。

编辑：

这可能会更简单。但我正在寻找基于div的解决方案。

解决方案

这是你想要的吗？

已添加：< div id =rightstyle =display：table-cell; vertical-align：middle;&
RIGHT
< / div>


jsFiddle更新： http://jsfiddle.net/5vpA3/157/

I originally had floating divs and i wanted content inside these floats to be vertically aligned.

This was giving me troubles so i had to remove floats.

I came around this fiddle referred in this post.

And used the fiddle to get desired layout. But i am facing troubles vertically aligning divs.

I tried,

vertical-align:middle;
display:table-cell;

For parent containers and

display: inline-block;

for child contents.

1) In this fiddle. I want the right to be vertically aligned inside right-container.

To say in other words. I want to have two divs vertically aligned inside a main div, and divs inside each of two divs need to be vertically alined.

2) How can i achieve the vertical alignment inside the floats? So i may not change my original layout. Say in the fiddle right and left are floats.

Need some pointers.

Edit:

This might be simpler with tables. But i am looking for div based solutions.

解决方案

Is that what you want?

Added: <div id="right" style="display:table-cell;vertical-align:middle;"> RIGHT </div>

jsFiddle update: http://jsfiddle.net/5vpA3/157/

这篇关于垂直对齐的div里面另一个 - 问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！