HELP | I cant get my text in the middle of the NAV bar!


Hello! I have encountered a issue with my Nav bar on my website ( and my bar is not in the middle. I know how to center the text, but I can not get it in the middle of the bar. Here is the code I am using:

 .main-nav {
                font-size: 32px;
                background-color: #eeeeee;

.main {
  position: relative; 

.main-nav {
  background: #f3f3e8;
  height: 80px;
  z-index: 150;
  margin-bottom: -80px;
  box-shadow: 0 2px 3px rgba(0,0,0,.4);

Please help as soon as possible!


you can simple add text-align: center; to .main-nav? Are we talking horizontal or vertical align. What exactly is the problem?

Using it:

which text? What is it referring to? What align are we talking about? Use classnames or id names, a good answer can only be provided if the question is good


I am saying that the text is not sandwiched so that it is a equal height away from both ends


For a example look at twitters nav bar. See how its n the middle of the bar


you mean you have items at the left, then nothing and then items at the right?

That is simple, wrap the first two <a></a> inside a div, float this div left, same for the remaining two anchors, wrap it in a div and float it right