如何使用 css 和 html 将文本和位置居中

Question

我有一个 div(content) class，其中文本 1 应居中，文本 2 应位于右侧。我尝试使用 position:absolute 但文本 2 超出了 div.

       <div style="text-align: center;">              
          <div>
            <h3 class="content-title">Text1 </h3>              
          </div>
          <div style="position:absolute; right:20px; top:80px;">Text 2</div>
        </div>

下面是一张我想要得到的图片。

Click here to see the image

Answer 1

只需将 position:relative; 添加到主 div 并从 text-2

中删除 top:80px;

<div style="text-align: center; position: relative;">              
  <div>
    <h3 class="content-title">Text1 </h3>              
  </div>
  <div style="position:absolute; right:20px; top:0px;">Text 2</div>
</div>

如何使用 css 和 html 将文本和位置居中

How to center a text and position to right using css and html

html

css