在表格单元中显示一条消息。

I have a table where I display some values ​​in my cells. I can have empty cells, so I displays unavailability message in this case .

我有一个表，在我的单元格中显示一些值。我可以有空单元格，所以我在这个例子中显示了不可用信息。

I would post my message in a different style as in the following screenshooot .

我将以不同的方式发布我的信息，就像下面的屏幕截图一样。

Plunker

砰砰作响

<p data-ng-class="{minPriceText: price.isMinPrice, priceText: !price.isMinPrice}" class="ng-binding minPriceText">38,00 €</p>

how to display my unavailability text across my cell as my example shows ..?

如何在我的单元格中显示我的不可用文本?

2 个解决方案

#1

Add this CSS in your tag..

在标签中添加这个CSS。

.yourClass {
     -moz-transform:    rotate(315deg);
     -o-transform:      rotate(315deg);
     -webkit-transform: rotate(315deg);
     transform:         rotate(315deg);
      position: absolute;                    
}

Plunker: http://plnkr.co/edit/Gw9tkLnzcCduI7Rx87ha?p=preview

砰砰作响:http://plnkr.co/edit/Gw9tkLnzcCduI7Rx87ha?p=preview

#2

You could rotate your text.

你可以旋转文本。

.tablecell {

/* Safari */
-webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* IE */
-ms-transform: rotate(-90deg);

/* Opera */
-o-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}