centering

As Chyno explained it doesn't center because of the display: inline-block;. My guess is that you have googled how to underline an H1 element and used their way. But I found another way of doing it:

<h1><span>About Me</span></h1>

I've added the span element to make the border. This elements width is being constrained by the actual width of the H1 element.

h1 {
  font-family: 'Raleway', sans-serif;
  text-transform: uppercase;
  text-align: center;
  padding: 1em 2rem;
  }

h1 span {
  border-bottom: solid black;
  padding-bottom: 0.6em;
}

This is the CSS for the border and effect. Hope this helps :)

It won't center because you have h1 set to display: inline-block. Remove it and it will center.

I hope this helps.

thanks so much - interesting so inline-block elements do not center? so i originally had inline- block their because i wanted to be able to adjust the bottom border on the h1 and make it just a little bigger than the heading itself. if i remove inline-block the heading covers the entire page. So how would i fix this problem?

You can also try this: leave the h1 tags as you you have now. (without span tags and with the display: inline-block) Put this css rule on the parents of the h1 tags (section tags) :

section {
  text-align: center;
}