Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Trouble Relatively Centering an Text Element Reply To: Trouble Relatively Centering an Text Element

#236489
Paulie_D
Member

Firstly, you really don’t need to put the link in a p tag…so I’d lose that.

Then set .feature to text-align:center and it will center autmatically (assuming you remove the p tag wrapping it.

Next…font-size:40 is an invalid value.

So..

.feature {
  text-align: center;
}

.feature h1 {
  padding-top: 175px;
  margin: 50px;
  color: white;
  font-family: "fira-sans-2", sans-serif;
  font-style: normal;
  font-weight: 200;
  font-size: 65;
  text-align: center;
}

.feature a {
  padding: 10px;
  font-size: 40px;
  border: solid;
  border-color: white;
  position: relative;
  color: white;
  text-decoration: none;
}

Gets you

http://codepen.io/Paulie-D/pen/pgPoaM

Moving things with positioning (relative/absolute etc) should b reserved for specific effects..not tweaking things into place because you can’t quite line them up properly.

That’s what general layout, margins & padding are for.