使文本在大元素顶部对齐

时间:2014-08-18 19:14:13

标签: html css

问题是我有一个78px大的

元素。我需要将文本对齐<p>元素的右侧,并且顶部要将文本与元素的中心对齐。

有办法解决这个问题吗?

<span>
    <p>1</p>
    <span>
        <p>First,</p>
        <p>to the Insured, we promist to pay all valid claims promptly, fairly and efficiently.</p>
    </span>
</span>

CSS

.cont .mid                                    { padding-top:20px; }
.cont .mid span                               { float:left; text-align: left }
.cont .mid span > p                           { float:left; color:#a01d3b; font-size:78.12px; font-family: 'Oswald', sans-serif; }
.cont .mid span span                          {  }
.cont .mid span span > p                      {  }
.cont .mid span span > p:first-child          { font-size:16.67px; color:#454545; text-align:left; float:left; }
.cont .mid span span > p:last-child           { font-size:9.37px; color:#9a9a9a; text-align:left; float: left }

1 个答案:

答案 0 :(得分:0)

span{text-align:right}
span > p:first-child{text-align:center}

你可能需要添加.cont .mid部分,但由于我没有看到它的引用,你去了。无论哪种方式,你能做的最好的事情就是简单地使用CLASSES,这就是CSS的用途,所以你可以这样做:

<span>
<p class="centered">1</p>
  <span class="rightalign">
    <p>First,</p>
     <p>to the Insured, we promist to pay all valid claims promptly, fairly and efficiently.</p>
  </span>
 </span>

现在你可以在你网站的任何地方使用.centered和.rightalign来代替我给你的那些类的CSS代码,比如

.rightalign{text-align:right}
.centered{text-align:center}