Sometimes css isn't quite enough to get that sweet responsive site working perfectly. Responsive Markup is an approach to adapting the HTML markup of your page based on Media Queries.
A good indicator for using this pattern is when your css shows and hides content based on breakpoints, a common example would be off-page mobile navigation.
Angular JS provides an excellent platform for using Responsive Markup. angular-responsive-include is a directive I've created to provide an elegant way to follow the Responsive Markup pattern in your Angularjs apps.
<div class="small include"> <ng-include-resp src="'/views/mobile-nav.html'" is-default mq="(max-width:899px)"></ng-include-resp> </div> <div class="large include"> <ng-include-resp src="'/views/desktop-nav.html'" mq="(min-width:900px)"></ng-include-resp> </div>