Center align and bound content

Just like this region

HTML:

<div class=“row-fluid”>
  <div class=“bound”>
    <div class=“span12”>
      Content
    </div>
  </div>
</div>

CSS:

.ubc-menu .container, /* Center align for menu */
.full-width-container .bound {
	max-width: 940px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
	padding-right: 0;
}
@media screen and (min-width: 1200px) {
	.ubc-menu .container,
	.full-width-container .bound {
		max-width: 1170px;
	}
}
@media screen and (max-width: 979px) {
	/* This class adds the padding back in for mobile/tablet view*/
	.full-width-container .bound {
		padding-left: 20px;
		padding-right: 20px;
		width: auto;
	}
}

Region without “Bound” will be expand to full width. Best to mix with no-padding CSS rules and class to allow this region flush to window's width

Content will be expand to full width, while maintain the twelve columns grid behaviour