表格内的文本框td

我一直在金字塔网站上工作，并遇到问题。我的td中有一个textbox，如果文本很长，则无法看到。这里是什么样子：表格内的文本框td

正如你可以看到level1部分在那里，如果我有一个名称，如someLongnameforever，它只会被看作是这样的：

有没有解决这个使用CSS或任何技巧？顺便说一句，我正在使用bootstrap。

如果你想看到我的桌子代码，点击this。我也使用twig模板。

现在我已经使用textarea为1级领域。

来源

2015-08-28 FewFlyBy

这取决于，你想要什么'固定'？你想要扩展inputfield还是只想显示更多文本？ – Patrick2607

@ Patrick2607显示更多或更好的 – FewFlyBy

您可以添加overflow: scroll;允许滚动或者你可以添加一个工具提示属性，所以当用户然而，他们将看到的全部内容。

来源

2015-08-28 11:19:31

您的意思是提示？ – FewFlyBy

你为什么不尝试，如果超过其可获得的最大宽度ellipsing。也许尝试在工具提示中显示完整的名称？

这将保持表格清洁。

来源

2015-08-28 11:19:56 Shivi

Tooltip是一个不错的主意。你的意思是什么椭圆形？ – FewFlyBy

@FewFlyBy：Ellipsing意义，尝试添加这样的事情 .truncate { 宽度：250像素; white-space：nowrap; 溢出：隐藏; text-overflow：ellipsis; } 所以，如果你的测试是一样的东西“嗨，你好吗？”，那么它有可能成为像“嗨，怎么......”，然后就可以显示工具提示的完整文本。 :) – Shivi

它不起作用 – FewFlyBy

Demo包字新行，如果有溢出

button{ 
     word-wrap:break-word; 
white-space: normal; 
}

来源

2015-08-28 11:22:40

这不起作用胸罩 – FewFlyBy

http://jsfiddle.net/yousafzainasir9/a6x3u3qt/1/ –

它在这里工作 –

我想你可以做这样的事情。您应该可以更改示例以适合您的需求。

HTML

<div id="fitin"> 
    <div>Lorem im Lorem im Lorem im Lorem im</div> 
</div>

$(function() { 
     var $fitin = $('#fitin'); 
     var $fitindiv = $('#fitin div'); 

     $fitindiv.css('font-size', '1em'); 

     while($fitindiv.height() > $fitin.height()) { 
      $fitindiv.css('font-size', (parseInt($fitindiv.css('font-size')) - 1) + "px"); 
     } 
    });

CSS

#fitin { 
    width: 100px; 
    height: 30px; 
    border: 1px solid black; 
    overflow: hidden; 
    font-size: 1em; 
}

检查fiddle

来源

2015-08-28 11:43:34 R4nc1d

我不想读数据不同字体大小的桌子 –

我在桌子上试过了，它不像预期的那样工作，就像div – FewFlyBy

@JuanMendes，我也不会，但是考虑到我能想到的问题。 – R4nc1d

表格内的文本框td

回答

相关问题