title: how to place pager to end of top of toolbar in free jqgrid
body: <p>free jqgrid top toolbar contains lot of buttons, select element and pager without last page button.
  Buttons are wrapped to multiple lines. Central part is removed using</p>
  
  <pre><code>#grid_toppager_center {
      width: 0;
  }
  </code></pre>
  
  <p>Since pager is in right area, there is lot of unused empty space  below and after pager:</p>
  
  <p><img src="https://i.stack.imgur.com/FxK1E.png" alt="emptry space"></p>
  
  <p>I tried to remove empty space using </p>
  
  <pre><code>#grid_toppager_center, #grid_toppager_right {
      width: 0;
  }
  </code></pre>
  
  <p>and</p>
  
  <pre><code>    pagerpos: 'left',
  </code></pre>
  
  <p>In this case pager appears in top of toolbar buttons:</p>
  
  <p><img src="https://i.stack.imgur.com/TW1fo.png" alt="top"></p>
  
  <p>How to place pager to other place, for example to end of top toolbar ?</p>
  
  <p>jqgrid settings:</p>
  
  <pre><code>$.extend($.jgrid.defaults, {
      iconSet: "fontAwesome" ,
      autoResizing: { compact: true,widthOfVisiblePartOfSortIcon: 13 },
      toppager: true,
      viewrecords: false,
      pagerpos: 'left',
      rowList: [50, 500, 1000],
      rowNum: 50,
  </code></pre>
  
  <p>style:</p>
  
  <pre><code>#grid_toppager_center, #grid_toppager_right {
      width: 0;
  }
  
  .ui-pg-button-text {
      margin: 4px !important;
  }
  
  .ui-jqgrid .ui-jqgrid-toppager .ui-pg-div &gt; span {
      margin: 0 5px;
      font-size: 20px;
  }
  
  .ui-jqgrid .ui-pg-table .ui-pg-button.ui-state-active {
      margin: 1px;
      font-weight: normal;
  }
  </code></pre>
  
  <p><strong>Update</strong></p>
  
  <p>I tried demo from </p>
  
  <p><a href="http://www.ok-soft-gmbh.com/jqGrid/OK/tougleButton1_iconOver2.htm" rel="nofollow noreferrer">http://www.ok-soft-gmbh.com/jqGrid/OK/tougleButton1_iconOver2.htm</a></p>
  
  <p>and decreased jqgrid width.</p>
  
  <p>Empty space still appears:</p>
  
  <p><img src="https://i.stack.imgur.com/iNxIt.png" alt="empty"></p>
  
  <p>How to put buttons to this area so that they use whole grid width and wrap as many lines as nessecary ? After buttons where should be pager.</p>
  
  <p>Desired is compact toolbar occupying as few rows as possible (two last buttons removed in this sample):</p>
  
  <p><img src="https://i.stack.imgur.com/hH9ft.png" alt="desired2"></p>