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>

如何在CSS中居文本列

1 个答案: