如何在CSS中放置文本列

Question

我在兩個文本列，小型（初學者）項目以及朋友和我正在開發的項目中都有一個小菜一碟。這是我們的代碼。

h3 { 
text-align: left; 
font-family: Times; 
display:flex; 
align-items:center; 
} 



.AboutBA { 
text-align: justify; 
width: 400px; 
height: 300px; 
position: relative; 
left: 190px; 

} 

.Position { 
text-align: justify; 
width: 400px; 
height: 300px; 
position: relative; 
left: 650px; 
bottom: 319px; 
} 

我不想改變太多，不破壞佈局，我正在尋找的唯一事情就是讓他們站在下面的圖片上方居中的兩個文本列。

Here is how the code looks as of now.

Answer 1

.textDiv { 
 
     width: 100%; 
 
     background-color: #CDD0E1; 
 
     position: absolute; 
 
     bottom: 0; 
 
     right: 0; 
 
     display: table; 
 
     height:200px; 
 
    } 
 

 
     .textDiv div { 
 
      float: left; 
 
      width: 35%; 
 
      padding:10px 5% 20px; 
 
      display: inline-table; 
 
     } 
 
    .textDiv div span { 
 
       text-align: justify; 
 
        font-size: 13px; 
 
      } 
 
      .textDiv div strong { 
 
       font-size: 16px; 
 
       line-height: 40px; 
 
       text-align: left !important; 
 
      }

<div class="textDiv"> 
 
    <div> 
 
    <strong> teacher empowers kids</strong> 
 
    <br /> 
 
    <span>Chris Ulmer, 28, reflects on the decision to leave his teaching career in order to focus on a worldwide mission. 
 
    </span> 
 
    </div> 
 
    <div> 
 
    <strong> How he found his calling</strong> 
 
    <br /> 
 
    <span> Ulmer, originally from Philadelphia, attended Penn State where he majored in media effects, or 「the way social media affects those who take it in,」 he explains. 
 
    </span> 
 
    </div> 
 
</div>