title: How to left-align some content in Clarity <clr-dg-footer>
body: <p>I have a Clarity <a href="https://vmware.github.io/clarity/documentation/datagrid/structure" rel="nofollow noreferrer">datagrid</a> with pagination and a filter.  I have some text that I would like to left-align on the same line as the pagination information.  What's the correct way to  do this?  I've tried setting <code>float: left;</code> and <code>float:right;</code> in the two spans and also using the built-in "row" class.  For reference, my footer looks like </p>
  
  <pre><code>&lt;clr-dg-footer&gt;
      &lt;span style="width:100%;"&gt;Search by value&lt;/span&gt;
      &lt;span *ngIf="procs.length&gt;0"&gt;
        {{pagination.firstItem + 1}} - {{pagination.lastItem + 1}}
        of {{pagination.totalItems}}
      &lt;/span&gt;
  
      &lt;clr-dg-pagination #pagination [clrDgPageSize]="10"&gt;&lt;/clr-dg-pagination&gt;
    &lt;/clr-dg-footer&gt;
  &lt;/clr-datagrid&gt;
  </code></pre>
  
  <p>This is transformed into something like:</p>
  
  <pre><code>&lt;clr-dg-footer _ngcontent-c25="" class="datagrid-foot"&gt;
    &lt;div class="datagrid-foot-description"&gt;
        1 - 10
        of 103 users
    &lt;/div&gt;
    &lt;clr-dg-pagination _ngcontent-c25="" _nghost-c27=""&gt;
      &lt;ul _ngcontent-c27="" class="pagination"&gt;
          ...
      &lt;/ul&gt;
    &lt;/clr-dg-pagination&gt;
  &lt;/clr-dg-footer&gt;
  </code></pre>