origin/issue-310/band-layout adjust css to ensure band takes up all available space

Author: starryeyez024

elements/pfe-band/demo/index.html

@@ -217,6 +217,29 @@ <h3 slot="header">Aside: left body top</h3>
       </footer>
     </pfe-band>
 
+     <pfe-band  pfe-aside-desktop="left" pfe-aside-mobile="top">
+      <header slot="pfe-band--header">
+        <h2>Short content band</h2>
+        <p class="custom-band-summary">Header region, consetetur sadluptua.</p>
+      </header>
+      <p>Short content sadipscing elitra.</p>
+      <pfe-cta priority="primary">
+        <a href="#">Learn more</a>
+      </pfe-cta>
+      <pfe-card color="lightest" slot="pfe-band--aside">
+        <h3 slot="header">Aside: left body top</h3>
+        <p>Ut wisi enim ad minim veniam.</p>
+        <pfe-cta slot="footer" priority="tertiary">
+          <a href="#">Learn more</a>
+        </pfe-cta>
+      </pfe-card>
+      <footer slot="pfe-band--footer" class="custom-footnote">
+        <ol>
+          <li>Footnote ipsum accusam et justo duo dolores et ea rebum.</li>
+        </ol>
+      </footer>
+    </pfe-band>
+
     <pfe-band pfe-color="complement" pfe-aside-desktop="left" pfe-aside-mobile="top" pfe-aside-height="body">
       <header slot="pfe-band--header">
         <h2>Complement band, layout classes</h2>

elements/pfe-band/src/pfe-band.scss

@@ -286,6 +286,7 @@ $LOCAL: band;
 
     position:  relative;
     margin:    0 auto;
+    width: 100%;
     max-width: #{pfe-local(Width)};
 
     // Grid support styles