--- { "title": "Mixed Structures", "language": "en", "tag": "menu", "parentdir": "menu", "parentPage": "Footer Menu Integration", "parentPageURL": "footer-menu", "altLangPrefix": "footer-menu-mix", "altFooter": "../ajax/footer-menu-mix", "dateModified": "2018-08-06" } ---

Purpose

A single footer can contain sections that use different patterns. This will work, but it is not officially supported. Consider using the same pattern for all sections instead.

Code

<footer role="contentinfo" id="wb-info" class="visible-sm visible-md visible-lg wb-navcurr">
	<div class="container">
		<nav role="navigation" class="row">
			<h2>Example Footer</h2>
			<section class="col-sm-4">
				<h3>Heading 1</h3>
				<ul class="list-unstyled">
					<li><a href="#">List Element 1.1</a></li>
					<li><a href="#">List Element 1.2</a></li>
				</ul>
			</section>
			<section class="col-sm-4">
				<h3>Heading 2</h3>
				<p><a href="#">Link 2.1</a></p>
			</section>
			<section class="col-sm-4">
				<h3><a href="#">Heading 3</a></h3>
			</section>
		</nav>
	</div>
</footer>