Html 如何在DIV中包含表

我有一个包含表的外部DIV标记。该表包含1列或TD标记。此TD标记有一个显示公司名称的内部DIV

有时，公司名称对于外部DIV来说太长，这取决于外部DIV的宽度。因此，我在TD的DIV标记中添加了以下样式：

style="width:95%; text-align: center; -ms-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; white-space:nowrap; overflow:hidden"

这工作得相当好，一个长的公司名称将包含在外部DIV中，部分公司名称将丢失，并且。。。在公司名称的末尾

我遇到的问题是，如果外部DIV的大小太小或公司名称太长，那么公司名称TD标记将溢出到右侧不相关的DIV标记中

当外部DIV的大小约为400px，但公司名称为700px时，会发生这种情况。但在400px外部分区中，600px公司名称的工作方式与预期一致

如何使表的TD和内部DIV标记始终显示在外部DIV标记宽度的内部

---

这是一个正在发生的事情的例子。第一行是我想要的，但如果包含的DIV宽度较窄，则省略号不会显示，表格会溢出到右侧的DIV：

尝试将文本包装到DIV中，使用以下类：

/* Source: http://snipplr.com/view/10979/css-cross-browser-word-wrap */
.wordwrap { 
    white-space: pre-wrap;      /* CSS3 */   
    white-space: -moz-pre-wrap; /* Firefox */    
    white-space: -pre-wrap;     /* Opera <7 */   
    white-space: -o-pre-wrap;   /* Opera 7 */    
    word-wrap: break-word;      /* IE */
}    

---

您可以添加一个JSFIDLE来演示这个问题吗？出于好奇，为什么有一堆带有单单元格表的s，而不是像一个大表这样的东西？这只是一个示例，说明了我的更大问题。我想将其分解以简化事情；在container DIV上。这将截断表并使其正确匹配。