Square - navigation issue?

[Smokey]

I can't seem to properly add a new link to my navigation on the Square theme.....this is the link to my forum:

https://www.nucleusboards.net


my header template looks like this:

<div class="scrolltotop"><i class="fa fa-caret-up fa-2x"></i></div>

<div id="container">

    <div id="header">
        <div class="wrapper">
              <div class="logo"><div class="logo2"><i class="fa fa-cube fa-fw"></i></div> Nucleus</div>
              <div class="menu">
                  <ul>
                      <li><a href="{$mybb->settings['bburl']}/index.php"><i class="fa fa-comments fa-2x"></i><br />Index</a></li>
                      <li><a href="{$mybb->settings['bburl']}/search.php"><i class="fa fa-search fa-2x"></i><br />Search</a></li>
                      <li><a href="{$mybb->settings['bburl']}/memberlist.php"><i class="fa fa-users fa-2x"></i><br />Members</a></li>
                      <li><a href="{$mybb->settings['bburl']}/calendar.php"><i class="fa fa-calendar-o fa-2x"></i><br />Calendar</a></li>
                    <li><a href="{$mybb->settings['bburl']}/misc.php?action=help"><i class="fa fa-question-circle fa-2x"></i><br />Help</a></li>
                    <li><a href="{$mybb->settings['bburl']}/arcade.php"><i class="fa fa-gamepad fa-2x"></i><br />Arcade</a></li>
                    <li><a href="{$mybb->settings['bburl']}/donate.php"><i class="fas fa-dollar-sign fa-2x"></i><br />Donate</a></li>
                  </ul>
              </div>
        </div>
    </div>
  
    <div id="panel">
          <div class="wrapper">
            <div class="news">
                <div class="announcements"><i class="fa fa-microphone fa-2x"></i></div>
                    <div class="automsj">
                        <ul>
                              <li class="quotes">Welcome to Nucleus</li>
                            <li class="quotes">We are a friendly community</li>
                              <li class="quotes">Why not join us to gain awesome member only benefits.</li>
                        </ul>
                    </div>
            </div>
            <div class="usersection">
                {$welcomeblock}
            </div>
        </div>
    </div>
      
        <div id="content">
            <div class="wrapper">
                  <br />
                  <navigation>
                {$pm_notice}{$naoardonate_notice}{$naoardonate_bar}
                {$remote_avatar_notice}
                {$remote_profile_picture_notice}{$bannedwarning}
                {$bbclosedwarning}
                {$unreadreports}{$myprofile_alertbar}
                {$pending_joinrequests}
                {$awaitingusers} <!-- BAM -->{$bam_announcements}<!-- /BAM -->
                <br />

However, as you can see I added a donate link but it appears on the next line... instead of next to the Arcade link.

[ajack764]

It's because there isn't enough room to fit it inline with the others. It's an easy fix, just go to your style.css and find .menu ul li and change the width to 50px.

If you want to add more links you will either have to decrease the width of the list items or make a change somewhere else. If you have any more questions just ask

[Smokey]

That did it, thanks!

---

Also, where would I go to add font-awesome icons to the thanks/likes add-on for Square? Pic is attached below. Thanks!!