Question: I have 2 icons in divs and 1 link which works as a button

```css
.A {
  width: 50px;
  height: 50px;
  border: 1px solid black;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 5px;
}

a {
  text-decoration: none;
}

.B {
  width: 100px;
  height: 50px;
}

/* when i change font-size for example to 10px then the element moves down a bit*/

.A span {
  text-transform: uppercase;
  color: black;
  font-size: 10px;
}
```

```html
<script src="https://kit.fontawesome.com/4254229804.js" crossorigin="anonymous"></script>

<a href="#">
  <div class="A">
    <i class="fab fa-facebook-f"></i>
  </div>
</a>

<a href="#">
  <div class="A">
    <i class="fab fa-youtube"></i>
  </div>
</a>

<a href="#">
  <div class="A B">
    <span>sign up</span>
  </div>
</a>
```

here is a link to codepen <https://codepen.io/hanzus/pen/GRrMbbm>

Everything is centered when a font size of span element of "sign up" link is 16px, but when I change it for example to 10px then link moves a bit down and it is not on the same line with other divs with facebook and youtube links.

How do I get these links on the same line when I change a font-size of 1 element?

Answer: 
Wrap in flex:

```css
.container {
  display: flex;
}

```

```html
<div class="container">
  <a href="#">
    <div class="A">
      <i class="fab fa-facebook-f"></i>
    </div>
  </a>

  <a href="#">
    <div class="A">
      <i class="fab fa-youtube"></i>
    </div>
  </a>

  <a href="#">
    <div class="A B">
      <span>sign up</span>
    </div>
  </a>
</div>

```

[Codepen](https://codepen.io/tauzN/pen/poRWMrB)
You should only add "flex-direction: column;" for your CSS code.

```
.container{
  display: flex;
  flex-direction: column;
}

.A {
  width:50px;
  height: 50px;
  border: 1px solid black;
  display:inline-flex;
  justify-content:center;
  align-items:center;
  margin: 5px;
}

a {
  text-decoration:none;
}

.B {
  width: 100px;
  height: 50px;
}

.A span {
  text-transform: uppercase;
  color:black;
  font-size: 10px;
}

```