bbestul
bbestul

Reputation: 359

Flexbox Justify Content: Right not applying

I am trying to align my footer using flexbox and for some reason, it won't push it all the way to the right.

When using justify-content: center it will center the items but when I try to use justify-content: right it pushes all of the list items back to the left. I tried making the width of the box 100% but that didn't work either.

Here is some of the code I am using.

.site-footer {
  position: relative;
  a {
    color: blue;
    text-decoration: none;
  }
}

.social-footer-nav{
  ul{
    display: flex;
    list-style-type: none;
  }
}

.footer-nav{
  ul{
    display: flex;
    list-style-type: none;
  }
}
<footer id="colophon" class="site-footer">
    <div class="site-info">
        <nav class="social-footer-nav">
            <?php
            wp_nav_menu( array(
                'theme_location' => 'social',
                'menu_id'        => 'social-menu',
            ) );
            ?>
        </nav>
    </div>
<footer

Upvotes: 0

Views: 361

Answers (1)

bbestul
bbestul

Reputation: 359

Clearly just a overlooked option. There is ajustify-content: right but it does not push content in the flexbox to the right. To achieve content on the right side, justify-content: flex-end must be used.

Upvotes: 2

Related Questions