QwVVZP

index.html

<div class = "widget__header__table__cover">
  <div class="widget__header__table">
    <div class="widget__header_table_row">
      <div class="widget__header_table_col back__me">
        >
      </div> <!-- Table columns back button -->
      <div class="widget__header_table_col header__h1">
        <h1>Invite Friends to WeSwap</h1>
      </div> <!-- Table columns h1 header -->
    
    </div> <!-- Table row -->
    
  </div> <!-- Table view -->
    
</div> <!-- Main widget cover -->

QwVVZP.markdown

QwVVZP

A Pen by YAKUP KESKINDAG on CodePen.

License.

style.css

.widget__header__table__cover
{
  height:auto;
  width:100%;
  background-color: #565656;
}
.widget__header__table
{
  display: table;
  border-collapse: seperate;
  border-spacing: 0;
   width:100%;
}
.widget__header_table_row
{
  display: table-row;
}
.widget__header_table_col
{
  display: table-cell;
  padding: 30px;
}
.back__me
{
  width:15%;
  background-color:#ffc82f;
}
.header__h1
{
  width:85%;
  background-color:#e7582b;
}

h1
{
  text-align:center;
  color: white;
  font-size: 48px;
}