我试图创建一个加号，应该定位在一个h3标签旁边，到目前为止，加号停留在h3上面，它是相当烦人的。 我尝试应用边距和填充顶部，线高，但它仍然没有对齐。 我怎样才能将它们都对齐在同一条线上？ 这里我指的是这一行:

； 子关联<；/H3>

这是我的html`

null

* {
  padding: 0px;
  margin: 0px;
}

.nav {
  display: flex;
  justify-content: center;
  align-items: center;
  justify-content: space-evenly;
  width: 100%;
  height: 50%;
}

.header {
  height: 8%;
}

.nav-h1 {
  text-align: center;
  margin-top: 27px;
  font-size: 40px;
}

a {
  display: inline-block;
  margin: 10px;
  font-family: 'Segoe UI', sans-serif;
  font-family: SegoeUI;
  font-size: 16px;
  font-weight: bold;
  color: black;
  font-weight: bold;
}

.a-container {
  margin-left: 10%;
  margin-top: 27px;
}

.footer {
  background-color: #e8e8e8;
  height: 100%;
  width: 100%;
  padding-bottom: 0px;
}

.alignleft {
  margin-left: 8%;
  font-family: SegoeUI;
  font-size: 18px;
  font-weight: 900;
  color: #000000;
}

.alignright {
  margin-right: 8%;
  display: flex;
  flex-direction: row;
}

.logo-section {
  margin-top: 1.3%;
  margin-left: 2%;
}

.logo-img {
  padding: 6px;
}

.first-section {
  width: 100%;
  background-image: url("/assets/images/first-image.png");
  background-repeat: no-repeat;
  background-size: contain;
  position: relative;
}

.first-section-p {
  width: 400px;
  height: 314px;
  margin-left: 10%;
  padding-top: 10%;
  font-family: SegoeUI;
  font-weight: 900;
  font-size: 4vh;
  font-weight: 900;
  text-align: center;
  color: #262262;
}

.small-button {
  width: 331px;
  height: 92px;
  margin-left: 12%;
  background-color: #e7af17;
  font-family: SegoeUI;
  font-size: 18px;
  font-weight: 900;
  color: white;
  border: none;
}

.second-section-text {
  color: #e8e8e8;
  font-weight: 900;
  font-size: 70px;
  line-height: 0.7;
  font-family: SegoeUI;
  margin-left: 12%;
}

.content {
  min-height: 100%;
}

@media (min-width: 1281px) {
  .first-section {
    width: 100%;
    height: 800px;
    background-image: url("/assets/images/first-image.png");
    background-repeat: no-repeat;
    background-size: cover;
  }
  .small-button {
    width: 331px;
    height: 92px;
    margin-top: 8%;
    margin-left: 12%;
    background-color: #e7af17;
    font-family: SegoeUI;
    font-size: 18px;
    font-weight: 900;
    color: white;
    border: none;
  }
}

@media (min-width: 940px) {
  .small-button {
    width: 331px;
    height: 92px;
    margin-top: 8%;
    margin-left: 12%;
    background-color: #e7af17;
    font-family: SegoeUI;
    font-size: 18px;
    font-weight: 900;
    color: white;
    border: none;
  }
}

.second-section {
  margin-top: 100px;
  display: flex;
  justify-content: center;
}

.third-section {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 50px;
  margin-top: 100px;
  background-color: #e8e8e8;
}

.third-section-right-part {
  margin-left: 50px;
  margin-top: 5%;
}

.third-section-right-part-img {
  height: 300px;
  width: 300px;
}

.third-section-left-part {
  width: 20%;
  margin-top: 3%;
}

.forth-section {
  height: 500px;
  width: 100%;
  display: flex;
  justify-content: center;
}

.info-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 50px;
  width: 70%;
  background-color: #e7af17;
}

.info-box-content {
  text-align: center;
}

button {
  width: 330px;
  height: 65px;
  background-color: #ffffff;
  font-size: 28px;
  font-weight: bold;
  color: #262262;
  border: none;
  text-transform: uppercase;
}

.info-box-content-h1 {
  color: #ffffff;
  font-family: SegoeUI;
  font-size: 60px;
  font-weight: bold;
}

.info-box-content-p {
  font-family: SegoeUI;
  font-size: 20px;
  font-weight: 300;
  font-stretch: normal;
  color: #ffffff;
}

.message {
  width: 60%;
  margin-left: 10%;
}

.second-section-right-part {
  width: 50%;
  margin: 0 auto;
  margin-left: 30%;
}

.second-section-right-part-h3 {
  margin-top: 30px;
  color: #262262;
  font-weight: bold;
}

.second-section-right-part-p {
  margin-top: 30px;
}

.plus {
  display: inline-block;
  width: 50px;
  height: 50px;
  background: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff), #000;
  background-position: center;
  background-size: 50% 2px, 2px 50%;
  /*thickness = 2px, length = 50% (25px)*/
  background-repeat: no-repeat;
}

.alt {
  background: linear-gradient(#000, #000), linear-gradient(#000, #000);
  background-position: center;
  background-size: 50% 2px, 2px 50%;
  /*thickness = 2px, length = 50% (25px)*/
  background-repeat: no-repeat;
}

<div class="main-container">
  <div class="headers">
    <div class="nav">
      <h1 class="nav-h1">Logo</h1>
      <div class="a-container">
        <a>About</a>
        <a>Vision</a>
        <a>Solutions</a>
        <a>Technology</a>
        <a>Contact</a>
      </div>
      <div class="logo-section">
        <img class="logo-img" src="/assets/images/facebook.png" alt="facebook logo">
        <img class="logo-img" src="/assets/images/linkedin.png" alt="linkedin logo">
      </div>
    </div>
  </div>
  <div class="content">
    <div class="content-inside">
      <div class="first-section">
        <p class="first-section-p">Turnkey platforms <br> for businesses looking to rule the online market
          <button class="small-button">LEARN MORE</button>
        </p>
      </div>
      <div class="second-section">
        <!-- <div class="second-section-paragraphs">
                        <p class="second-section-text">WHAT</p>
                        <p class="second-section-text">WHE DO</p>
                        <p class="second-section-text">BEST</p>
                    </div> -->
        <div class="second-section-right-part">
          <section class="second-section-right-part">
            <div>
              <h3 class="second-section-right-part-h3">Social Media</h3>
              <p class="second-section-right-part-p">Social Media Offering a 360 degree solution to generating exposure via Social Media Marketing. Using both ATL and BTL strategies in large social networks such as Facebook and Linkedin but also in small networks when seeking a specific demographic
                target.</p>
            </div>
          </section>
          <section class="second-section-right-part">
            <div>
              <h3 class="second-section-right-part-h3"><span class="plus alt"></span> Sub-Affiliation</h3>
              <p class="second-section-right-part-p">Sub-Affiliation Genuinely strengthen your brand and jump start traffic with an affiliate program. Link with a large scale business led supply chain, monitor activity and generate returns through an exponentially growing platform.
              </p>
            </div>
          </section>
          <section class="second-section-right-part">
            <div>
              <h3 class="second-section-right-part-h3">Mobile Adds</h3>
              <p class="second-section-right-part-p">Mobile Adds A multi-channeled platform tailor made for the mobile environment allowing ease of access, real time delivery and results driven optimization solutions allowing for cost efficient lead capture.</p>
            </div>
          </section>
        </div>
      </div>
      <div class="third-section">
        <div class="third-section-left-part">
          <h4 class="second-se">Leading The Way</h4>
          <br>
          <p> Dark Side management is a dynamic Online Media Powerhouse fueled with passion for developing and growing online businesses into world renowned enterprises. Putting a strong accent on online marketing solutions, Vici is one step ahead of the
            game with superior data management systems and prompt on key response time.<br><br> Streamlined by future oriented workflow methodology, Vici are a resilient group of focused and dedicated specialists that have a profound understanding of
            their duties and priorities.</p>
        </div>
        <div class="third-section-right-part">
          <section>
            <img src="/assets/images/cospace.png" alt="" class="third-section-right-part-img">
          </section>
        </div>
      </div>
      <div class="forth-section">
        <div class="info-box">
          <div class="info-box-content">
            <h1 class="info-box-content-h1">The Mission is Simple</h1>
            <p class="info-box-content-p">
              To Strategically Drive The Online Community Forward, Through A Wide Spectrum Integrating Market Intelligence And Experience Throughout, By Offering Unparalleled Resources And A True Understanding Of The Client’s Arena. </p>

            <br>
            <button>Contact Us </button>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="footer">
    <div class="nav">
      <h5 class="nav-h1">Logo</h5>
      <div class="a-container">
        <a>About</a>
        <a>Vision</a>
        <a>Solutions</a>
        <a>Technology</a>
        <a>Contact</a>
      </div>
      <div class="logo-section">
        <img class="logo-img" src="/assets/images/facebook.png" alt="facebook logo">
        <img class="logo-img" src="/assets/images/linkedin.png" alt="linkedin logo">
      </div>
    </div>
    <p class="message">*Please read the Privacy Policy and Terms & Conditions before continuing. <br> Use of our Services and Brokers websites is at your own risk. Information on our Website, applications and any marketing or email marketing material is strictly for information
      purposes and should not be construed as professional advice nor as an offer to engage in online trading, which may result in substantial or complete loss of funds.
    </p>
  </div>
</div>

null