user8379139
user8379139

Reputation:

right aligning a bootstrap footer

I have a footer that is set up as follows:

    <hr>
<footer>
    <div class="row">
        <div class="col-md-6">
            <button type="button" class="btn btn-primary" onclick="window.location.href='Glossary.html'">Glossary</button>
            <button type="button" class="btn btn-primary" onclick="window.location.href='Bibliography.html'">Bibliography</button>
            <button type="button" class="btn btn-primary" onclick="window.location.href='For_Help.html'">Where To Go For Help</button>
        </div>
        <div class="col-md-6 col-md-offset-6" style="padding-top: 5px">
            <div class="panel panel-default">
                <div class="panel-body col-xl-1">
                    <p> For questions or concerns regarding this webpage, contact: <strong>[email protected]</strong></p>
                    <p>© 2017 <a href="index.html">Checkered Flags</a></p>
                </div>
            </div>
        </div>
    </div>
</footer>

How could I set it up such that the buttons are on the left, and the 2 paragraph tags are aligned with the buttons, however pulled to the right side of the screen? Currently the div with the paragraphs sits underneath the buttons. Ideally they would only go underneath when the screen size was small enough

Upvotes: 0

Views: 670

Answers (2)

Maarten van Tjonger
Maarten van Tjonger

Reputation: 1927

Looks like the col-md-offset-6 class is pushing it down as well as the padding-top: 5px;.

See: https://codepen.io/anon/pen/ZJaJwe

Upvotes: 1

Matteo Manili
Matteo Manili

Reputation: 11

Try This

<div class="panel-body col-xl-1">
   <div class="pull-right">
      <p> For questions or concerns regarding this webpage, contact: 
      <strong>[email protected]</strong></p>
      <p>© 2017 <a href="index.html">Checkered Flags</a></p>
   </div>
</div>

Upvotes: 1

Related Questions