javascript - 一个 div 的内容与另一个 div 重叠

Question

我有 4 个 div 这些是

<div id="wrapper"><div id="AccWiseDate">Date</div><div id="AccWiseMemo">MemoMemoMemoMemoMemoMemo</div><div id="AccWiseDebit">Debit</div><div id="AccWiseCredit">Credit</div></div>

我的CSS代码是

#wrapper {
    position: relative;
  width:100%;
  clear: both;
}

#AccWiseDate {
    float: left;
    width:25%;
    text-align: left;
    font-size: 15px;
}

#AccWiseMemo {
    float: left;
    width:25%;
    text-align: left;
    font-size: 15px;
}

#AccWiseDebit {
    float: left;
    width:25%;
    text-align: left;
    font-size: 15px;
}

#AccWiseCredit {
    float: left;
    width:25%;
    text-align: left;
    font-size: 15px;
}

有时 memo 比宽度大得多，因此它与另一个 div 重叠。我需要隐藏额外的文字。有关更多详细信息，请参见 jsfiddle http://jsfiddle.net/WuZat/65/

我错了什么。请帮助谢谢

Answer 1

尝试如下修改 AccWiseMemo 看看是否有帮助。

#AccWiseMemo {
    float: left;
    width:25%;
    text-align: left;
    font-size: 15px;
    overflow:hidden;
}

Answer 2

您必须使用 css 属性。

#AccWiseMemo {
float: left;
width:25%;
text-align: left;
font-size: 15px;
word-break: break-all;}

请用上面的代码替换您的代码并检查。

Answer 3

利用word-wrap: break-word;

#AccWiseDebit {
    float: left;
    width:25%;
    text-align: left;
    font-size: 15px;
    word-wrap: break-word;
}