Footer Navigation

The footer is the area at the bottom of every page on a website; navigation and other information in the footer should be consistent on every page.

Usage

Positioned at the very bottom of a webpage, footer navigation commonly lists contact information, location, and links to social media and hard-to-find content. Footer navigation can also mirror main navigation.

Example

<footer style="display:none">
<div id="site-footer">
<div class="container">
<div class="row flex-layout">
<div class="col-sm-9">
<div class="row flex-layout">
<div class="col-md-6 col-lg-6">
<div class="clearfix">
<div class="text">
<address><span class="heading">Columbia University School of the Arts</span>2960 Broadway · New York, NY 10027</address>
</div>
</div>

<div class="clearfix">
<div class="text">
<address><span class="heading">Lenfest Center for the Arts</span>615 W 129th St · New York, NY 10027</address>
</div>
</div>
</div>

<div class="col-md-6 col-lg-3">
<div class="clearfix">
<div class="text">
<h2>Contact Us</h2>

<div class="value"><a href="mailto:[email protected]">[email protected]</a></div>
</div>
</div>
</div>

<div class="col-md-6 col-lg-3">
<div class="social" id="cu-social-links">
<h2>Follow Us</h2>
<a class="external" href="https://www.facebook.com/ColumbiaUniversitySchooloftheArts/" rel="noopener" target="_blank"><span class="sr-only">Facebook</span></a> <a class="external" href="https://twitter.com/columbiasoa" rel="noopener" target="_blank"><span class="sr-only">Twitter</span></a> <a class="external" href="https://www.instagram.com/columbiaschoolofthearts/" rel="noopener" target="_blank"><span class="sr-only">Instagram</span></a> <a class="external" href="https://www.youtube.com/user/CUSchooloftheArts" rel="noopener" target="_blank"><span class="sr-only">Youtube</span></a></div>
</div>
</div>
</div>

<div class="hidden-xs col-sm-2 col-md-2 col-lg-2 pull-right" data-ng-switch="" on="footer_menu || 'null'">
<ul class="ng-scope" data-="">
	<li><a href="/policies"><span class="ng-binding">Policies</span></a></li>
	<li><a data-ng-href="/about/equity-diversity-inclusion" href="/about/equity-diversity-inclusion"><span class="ng-binding">Equity, Diversity, and Inclusion</span></a></li>
	<li><a data-ng-href="https://visit.columbia.edu/content/maps-and-directions-update" href="https://visit.columbia.edu/content/maps-and-directions-update" rel="noopener" target="_blank"><span class="ng-binding">Campus Maps</span></a></li>
	<li><a data-ng-href="https://publicsafety.columbia.edu/" href="https://publicsafety.columbia.edu/" rel="noopener" target="_blank"><span class="ng-binding">Public Safety</span></a></li>
	<li><a data-ng-href="https://lenfest.arts.columbia.edu/" href="https://lenfest.arts.columbia.edu/" rel="noopener" target="_blank"><span class="ng-binding">Lenfest Center for the Arts</span></a></li>
</ul>
</div>
</div>
</div>
</div>
</footer>