显示表/表格单元格 - 将一个单元格对齐到右侧

Question

所以,这是我的代码:http://jsfiddle.net/8xpL78ow/我有一些问题我不知道如何解决:

a)我希望按钮与右侧对齐并始终保持在一行(不要像"非常长的文件夹名称"示例中那样在其他按钮下折叠).如果float: right在.btn-groupdiv上使用,那没关系,但这是我的第二点:

b)我希望文本填充所有剩余的水平空间.

任何帮助,将不胜感激.谢谢.

Answer 1

我会尝试这样的事情.

#folder-panel .btn-group {
    text-align: right;
    white-space: nowrap;
    padding-left: 5px;
}
#folder-panel .btn {
    float: none;
}

见演示:http://jsfiddle.net/audetwebdesign/xe208rxs/

由于您使用的是Bootstrap,因此需要确保CSS规则足够具体以使其生效.

我在您的.container块中添加了一个ID ,然后修改了.btn要设置的规则float: none.这意味着按钮现在将是内联元素.

如果您不想使用和ID,那么您必须确保在Bootstrap中复制选择器以覆盖您需要更改的CSS规则.

设置text-align: right为.btn-group,按钮将对齐右侧.最后,设置white-space: nowrap,这将阻止图标包装.

注意:您可以尝试设置最小宽度值,但这不太灵活.