[英]DataTables Plugin - Align buttons to the right
I'm using this plugin: https://www.datatables.net/我正在使用这个插件: https : //www.datatables.net/
I have a table listing all the news of the website, with: date, title, status and some actions (add, edit, delete), see here:我有一个表格列出了网站的所有新闻,包括:日期、标题、状态和一些操作(添加、编辑、删除),请参见此处:
And I want to put all those buttons aligned to the right.我想把所有这些按钮都向右对齐。 Exactly like that:
正是这样:
(I just have this result because i edited on photoshop) (我只有这个结果,因为我在 photoshop 上编辑过)
How can I do that?我怎样才能做到这一点? I tried with some "align right" but it doesn't work like i want...
我尝试了一些“正确对齐”,但它不像我想要的那样工作......
Can someone help me?有人能帮我吗? :)
:)
My code:我的代码:
$('#datatable').dataTable( {
"aaSorting": [],
"oLanguage": {
"sInfo": "<b>_TOTAL_</b> resultados encontrados"
},
});
The trick is to set autoWidth
to false, and define columns
so the "button column" has a fixed width and the other columns a relative percent width close to 100%.诀窍是将
autoWidth
设置为 false,并定义columns
以便“按钮列”具有固定宽度,而其他列的相对百分比宽度接近 100%。 It is important to avoid wordwrapping in the button column too.避免按钮列中的自动换行也很重要。 Example
例子
td.buttons {
white-space: nowrap;
}
var table = $('#example').dataTable({
autoWidth: false,
columns : [
{ width: '50%' },
{ width: '40%' },
{ width: '100px', class : 'buttons' }
]
})
small demo (OP has not provided an example) -> http://jsfiddle.net/pebmuu4w/小演示(OP 没有提供示例)-> http://jsfiddle.net/pebmuu4w/
NB: I assume you are using 1.10.x since you are just referring to dataTables in general.注意:我假设您使用的是 1.10.x,因为您通常只是指数据表。 If not the above options is named
bAutoWidth
, aoColumns
, sWidth
and sClass
.如果不是,上述选项被命名为
bAutoWidth
、 aoColumns
、 sWidth
和sClass
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.