<p>Teks kini dijajarkan di bawah imej. Saya mahu teks dijajarkan secara menegak di sebelah imej. Saya cuba menambah <kod>flex-direction: column</code> dan <code>justify-content: center</code> Saya juga mencuba <code>float</code> tetapi itu juga tidak berjaya. Saya tidak dapat memikirkan cara menjajarkan teks dan imej sebelah menyebelah. Bagaimanakah saya boleh menyelaraskannya sebelah menyebelah? Adakah terdapat sebarang ralat dalam kod saya? </p> <p><br /></p> <pre class="brush:css;toolbar:false;">.whoweare { padding: 80px 0px 50px; warna latar belakang: #000000; } .whoweare #whoweareimg { lebar: 100%; lebar min: 200px; } .whoweare .content { -webkit-paparan: flex; paparan: flex; flex-wrap: bungkus; /* flex-direction: lajur */ /* justify-content: pusat */ } .whoweare .content .box { /* padding:5px; lentur:0 0 100%; lebar maksimum: 100%; padding: 5px; lentur: 0 0 100%; lebar maksimum: 100%; } .whoweare .content #whoweareimg { lebar: 50%; -webkit-transform: rotateY(180deg); transform: rotateY(180deg); padding: 30px; } .whoweare .content h2 { saiz fon: 50px; berat fon: 500; jidar: 20px; warna: #ffffff; padding: 0px 0px 20px; } .whoweare .content p { saiz fon: 20px; ketinggian garis: 50px; warna: #ffffff; jidar: 20px; padding: 0px 0px 20px; font-family: 'Open Sans', sans-serif; }</pre> <pre class="brush:html;toolbar:false;"><section class="whoweare" id="whoweare"> <div class="container"> <div class="content"> <div class="box text wow slideInRight"> <!-- <div class="class-item"> <div class="item wow bounceInUp"> <!-- <div class="item-img"> <img id="whoweareimg" src="https://via.placeholder.com/50" alt="kelas" /> </div> <div class="box text wow slideInRight"> <h2>Siapa kita</h2> <p>UNDRGRND Otot & Kecergasan, budaya jalanan memenuhi gaya hidup bina badan dan kecergasan. Matlamat kami adalah untuk menyediakan ahli kami pengalaman latihan moden yang unik di Vaughan/Greater Toronto Area. </br> </br> Alami suasana latihan yang unik untuk membantu anda menyampaikan senaman yang tiada tandingannya. Atlet Profesional IFBB menawarkan sesi latihan eksklusif untuk membantu ahli mencapai gaya hidup dan/atau matlamat persediaan pertandingan mereka. Kemudahan itu akan menawarkan peralatan kecergasan terbaik di pasaran termasuk Atlantis, Cyber, Arsenal dan banyak lagi. </br> </br> Di UNDRNRGD, kami semua adalah satu keluarga besar, bekerjasama. <p><br /></p></pre>

.whoweare {
  padding: 80px 0px 50px;
  background-color: #000000;
}

.whoweare #whoweareimg {
  width: 100%;
  min-width: 200px;
}

.whoweare .content .box {
  padding: 5px;
  max-width: 100%;
}

.whoweare .content .box:first-child {
  display: flex;
}

.whoweare .content #whoweareimg {
  width: 50%;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  padding: 30px;
}

.whoweare .content h2 {
  font-size: 50px;
  font-weight: 500;
  margin: 20px;
  color: #ffffff;
  padding: 0px 0px 20px;
}

.whoweare .content p {
  font-size: 20px;
  line-height: 50px;
  color: #ffffff;
  margin: 20px;
  padding: 0px 0px 20px;
  font-family: 'Open Sans', sans-serif;
}

<section class="whoweare" id="whoweare">
  <div class="container">
    <div class="content">
      <div class="box text wow slideInRight">
        <!-- <div class="class-items"> -->
        <div class="item wow bounceInUp">
          <!-- <div class="item-img"> -->
          <img id="whoweareimg" src="https://via.placeholder.com/50" alt="classes" />
        </div>
        <div class="box text wow slideInRight">
          <h2>我们是谁</h2>
          <p>UNDRGRND Muscle & Fitness，街头文化与健美和健身生活方式相结合。我们的目标是为我们的会员提供独特的现代化培训体验，在Vaughan/GTA地区。
            </br>
            </br>
            体验独一无二的培训氛围，帮助您进行无与伦比的锻炼。IFBB职业运动员提供独家培训课程，以帮助会员实现他们的生活方式和/或比赛准备目标。该设施将提供市场上最好的健身设备，包括Atlantis、Cyber、Arsenal等。
            </br>
            </br>
            我们都是一个大家庭，在UNDRNRGD这里我们都在一起。>
        </div>
      </div>
    </div>
  </div>
</section>