Question

我已经检查了这个帖子Is it possible to vertically align text within a div?

但它不适合我。我希望文本在椭圆形的中心，但它不起作用。也许是因为它的形状不同？有没有可能的方法让我编码为椭圆工作？文本是水平居中但不是垂直居中。

HTML：

select
  *
from
  calendar c
  cross apply (
    select top 1 *
    from yourtable y
    where y.Datefiled < c.calendardate
    order by Datefiled desc
  ) y

CSS：

<div class="oval"> <span> Strawman </span> </div>

Answer 1

试试这个样式表，它可以帮助你

<style>
        .oval {
            -webkit-box-sizing: content-box;
            -moz-box-sizing: content-box;
            display: table;
            box-sizing: content-box;
            width: 200px;
            height: 50px;
            padding: 5px;
            border: none;
            -webkit-border-radius: 47% / 50%;
            border-radius: 47% / 50%;
            font: normal 100%/normal "Courier New", Courier, monospace;
            color: white;
            text-align: center;
            vertical-align: middle;
            -o-text-overflow: clip;
            text-overflow: clip;
            background: #99cc00;
        }

        .oval span {
            display: table-cell;
            vertical-align: middle;
        }

    </style>

垂直对齐特定形状的CSS

1 个答案: