-1

HTML

 <div class="container--wrap">
        <div id="rtitle">
          <p id="ptitle" style="color: #D8DCE6; font-size: 30px; text-align: center; padding-top: 15px; font-weight: bolder; margin-bottom: 0;">INFO
            <span id="fas" class="fas fa-info-circle w3-medium"></span></p>
        </div>
      </div>

CSS

#rtitle {
    display: inline-block;
    padding: 10px;
    margin: 10px;
    }

    #fas {
      font-size: 30px;
      display: inline-block;
      vertical-align: middle;
    }

    #ptitle {
      vertical-align: middle;
      display: inline-block;
    }
    .container--wrap {
      background-color: #1B2435;
      border-radius: 15px;
      margin: 5px;
      overflow: hidden;
      justify-content: stretch;
      align-items: flex-end;
    }

The content is pushed to the left, and I can't figure out how to align it, does anyone know how?

Any help would be appreciated - thank you!

bossman
  • 1
  • 3

1 Answers1

0

Use flexbox:

just add this css:

    display: flex;
    justify-content: center;

to .container--wrap.

BeHappy
  • 3,705
  • 5
  • 18
  • 59