RTL响应表

Question

我几乎是CSS

的新手

我找到了this网站的响应表。我想在我的应用程序中使用它。

问题是当我将表格变小并且从表格转换为{{1}时，我不知道如何使它从右到左（标题必须位于页面的右侧，值位于左侧） }。

这是Block代码：

CSS

Answer 1

进行以下更改：

1. 代表td，将padding-left更改为padding-right。
2. 代表td:before，将left更改为right，将padding-right更改为padding-left。
3. 将text-align: right添加到table。


更新：如果您希望自己的单元格以较窄的宽度换行：首先，从padding-right移除td，然后将td:before CSS更改为以下内容：

td:before {
  display: inline-block;
  vertical-align: top;
  width: 45%;
  padding-left: 10px;
}

这是一个涵盖更多边缘案例的完整示例：http://jsbin.com/ASOnaXug/2