0

目前我在我的网络应用程序中进行了以下设置，左侧有一个赞成/反对票，然后是用户输入的一些文本。 

 -----   -------------------------------
|up   | |some one liner text            |
|down |  -------------------------------
|vote | 
 -----

如果文本变得太长，它确实可以换行，但是它相对于上/下投票系统的位置会完全上升，如下所示：

//current undesired outcome
 -----   
|up   | 
|down |  
|vote |  -------------------------------
 -----  |some longer text goes here, it |
        |also magically centers if it   |
        |      goes several lines       |
         -------------------------------

我已经将我的 CSS 设置为相对简单，所以无法弄清楚为什么当文本换行发生时它一直到左调用框下方的中心。谢谢你的帮助！

.parent-div {
    overflow: hidden;
}

.votebox {
    float: left;
    width:40px; 
    height:50px;
    //there are more sub classes in here for the up/down vote arrows but I didn't include
}

.usertext{
    float:left;
    margin-left:10px;
}

谢谢

4

1 回答 1

1

如果我理解正确，这就是标记的样子：

<div class="left">
  up down vote
</div>

<div class="right">
  text...
</div>

如果是这样，只需放入overflow:hidden正确的 DIV：

.left{
    float:left;
    margin-right: 10px;
}

.right{
    overflow:hidden;
}

（演示）

于 2013-01-29T20:42:28.570 回答