How to stretch the div to the width of the parent in this case?

Question

css

The layout looks like this.
So - you need to make styles for "CONTACT" and "SKILLS" so that you can just hang up a class and everything works the same way and the strip after the title is stretched automatically to the width of the entire wrapper.
This is what the code looks like

.profile{
  width: 825px;
}
  .profile_head{
    display: flex;

  }
    .profile_logo{
      width: 148px;
      height: 148px;
      background-color: #3d6cb0;
      border-radius: 50%;
    }
    .all_left_titles{
      font-family: 'Conv_Myriad-Pro-Bold';
      font-size: 82px;
      color: #3d6cb0;
      display: flex;
      align-items: center;
      text-transform: uppercase;
      &:after{
        width: 100%;
        height: 13px;
        background-color: #3d6cb0;
        content: '';
      }
    }

BUT! The after element becomes zero-width and doesn't stretch. How to decide?

Answer 1

https://codepen.io/anon/pen/RYWdBw

Answer 2

I'm afraid there are no psychics here, so that without seeing the layout you can navang something according to styles. Well, set the after pseudo-element to "display: block;", as an option.

Answer 3

Add display:block; for after.
PS while writing already answered))

Answer 4

It was necessary to set "after" not to the text, but to the whole header. Everything worked