简体   繁体   English

数据表空白:一个特定列的 nowrap

[英]datatable white-space:nowrap for one specific column

I have a bootstrap datatable with alot of data.我有一个包含大量数据的引导数据表。 One row in particular (Product) will always have a large amount of data.特别是一行(产品)总是会有大量的数据。 Currently the row expands downwards and takes up alot of space目前该行向下扩展并占用大量空间

在此处输入图像描述

I am trying to get the Product column to expand to the right instead of down, so that the product column title expands to fit the width of the data.我试图让产品列向右扩展而不是向下扩展,以便产品列标题扩展以适应数据的宽度。 The closes I've gotten so far is by adding this css style:到目前为止我得到的关闭是通过添加这个 css 样式:

<style> td { white-space: nowrap; } </style>

Which will do the desired column growth, but for each column这将实现所需的列增长,但对于每一列

在此处输入图像描述

Is there a way to have ONLY the product column get better styling to it expands to the right and grows the column width?有没有办法让产品列获得更好的样式,使其向右扩展并增加列宽? Maybe even have two lines of text instead of one for a more compact text display.甚至可能有两行文本而不是一行,以实现更紧凑的文本显示。

https://jsfiddle.net/martinradio/yz46nLr8/61/ https://jsfiddle.net/martinradio/yz46nLr8/61/

You can use td:nth-child(9) .您可以使用td:nth-child(9)

td:nth-child(9){
  white-space: nowrap;
}

See the JSFiddle: https://jsfiddle.net/ju4d73po/请参阅 JSFiddle: https://jsfiddle.net/ju4d73po/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 空白:nowrap; 调整表格列宽 - white-space: nowrap; adjust table column width 用白色空间美化PRE中的亮点:nowrap是IE中的一行 - prettify highlightning in a PRE with white-space:nowrap is one line in IE 过渡无效(空白:nowrap-&gt;空白:正常) - Transition not working (white-space: nowrap -> white-space: normal) 使用空格选择父母身高:nowrap - Choosing Parent Height With white-space:nowrap Javascript切换按钮,用于空格换行/ nowrap - Javascript toggle button to white-space wrap / nowrap 使用“white-space:nowrap”会导致div幻灯片显示问题 - Using “white-space: nowrap” causes issue with div slideshow 涉及“white-space:nowrap”的高度转换:可能用更少的Javascript? - Transition of height with “white-space: nowrap” involved: possible with fewer Javascript? CSS空格nowrap似乎不起作用,可能是其他问题? - CSS white-space nowrap doesn't seem to be working, possibly different issue? 在移动设备中,空白:nowrap; 溢出:隐藏 文字溢出:省略号; 有点不起作用 - in mobile devices, white-space:nowrap; overflow:hidden; text-overflow:ellipsis; kinda do not work Ext Js 4“空白”仅适用于项目中的一个网格 - Ext Js 4 “white-space” only for one grid in project
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM