html - 我如何不使用“ float ”并排放置图片？

我正在自己的网站上工作，并且在我的技能部分上我应该并排2个程序，但是我的问题是这行不通，而且我不知道为什么这行不通。

我已经尝试过使用Float，但是在此方面我失败了，所以也许还有其他选择可以使用。

.Skills {
  width: auto;
  background-color: #262626;
}
.Meine {
  padding-top: 54px;
  padding-left: 50px;
  font-size: 30px;
  font-weight: 900;
  letter-spacing: 15px;
  color: #fff;
}
.skills {
  padding-top: 4px;
  padding-left: 50px;
  font-size: 30px;
  font-weight: 900;
  letter-spacing: 15px;
  color: #fff;
}
.UnterschriftNo3 {
  padding-top: 7px;
  padding-left: 50px;
  font-size: 13px;
  font-weight: 400;
  color: #fff;
}
.TrennungNo3 {
  padding-top: 7px;
  padding-left: 50px;
}
.Photoshop > div > img {
  margin-top: 36px;
  padding-left: 49px;
}
.Illustrator > div > img {
  margin-top: 36px;
  padding-left: 49px;
}
.InDesign > div > img {
  margin-top: 36px;
  padding-left: 49px;
}
.Dreamweaver > div > img {
  margin-top: 36px;
  padding-left: 49px;
}
.AfterEffects > div > img {
  margin-top: 36px;
  padding-left: 49px;
}
.PremierePro > div > img {
  margin-top: 36px;
  padding-left: 49px;
}
.SonyVegas > div > img {
  margin-top: 36px;
  padding-left: 49px;
}
.Cinema4D > div > img {
  margin-top: 36px;
  padding-left: 49px;
  margin-bottom: 30px;
}

<div class="Skills">

  <div class="Meine">
    <div>MEINE</div>
  </div>
  <!--Meine-->

  <div class="skills">
    <div>SKILLS</div>
  </div>
  <!--skills-->

  <div class="UnterschriftNo3">
    <div>DAS IST MEIN KÖNNEN</div>
  </div>
  <!--UnterschriftNo3-->

  <div class="TrennungNo3">
    <img src="Images/Strich_320.jpg" alt="" />
  </div>
  <!--TrennungNo3-->

  <div class="Programme">
    <div class="Photoshop">
      <div>
        <img src="Images/Photoshop.png" alt="" />
      </div>
    </div>

    <p>
      <div class="Illustrator">
        <div>
          <img src="Images/Illustrator.png" alt="" />
        </div>
      </div>
    </p>

    <div class="InDesign">
      <div>
        <img src="Images/InDesign.png" alt="" />
      </div>
    </div>

    <div class="Dreamweaver">
      <div>
        <img src="Images/Dreamweaver.png" alt="" />
      </div>
    </div>

    <div class="AfterEffects">
      <div>
        <img src="Images/AfterEffects.png" alt="" />
      </div>
    </div>

    <div class="PremierePro">
      <div>
        <img src="Images/PremierePro.png" alt="" />
      </div>
    </div>

    <div class="SonyVegas">
      <div>
        <img src="Images/SonyVegas.png" alt="" />
      </div>
    </div>

    <div class="Cinema4D">
      <div>
        <img src="Images/Cinema4D.png" alt="" />
      </div>
    </div>
  </div>


</div>
<!--Skills-->

最佳答案

添加此内容将使您前进。只需编辑.Programme> div即可：p

.Programme{
    display:flex;
    flex-direciton:row;
    flex-wrap:wrap
}

.Programme>div{
    width:40%;
   margin:0 auto;
}

关于html - 我如何不使用“ float ”并排放置图片？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/38779674/