Centering pager for view using Bootstrap 3 I am using Drupal 7 and Bootstrap Business, which is a theme that utilizes Bootstrap 3. I have found that my pager in my views pages is not centered.
I know that Bootstrap 3 for non CMS work has a particular css markup that you use to center pagers, but in Drupal 7 there is no UI in the view that allows you to alter the css for the pager that the view uses.

Here is the non changeable html for the pager for a view in Drupal 7

&lt;div class="item-list"&gt;&lt;ul class="pager"&gt;&lt;li class="pager-current first"&gt;1&lt;/li&gt;
  &lt;li class="pager-item"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=1" title="Go to page 2"&gt;2&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-item"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=2" title="Go to page 3"&gt;3&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-item"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=3" title="Go to page 4"&gt;4&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-item"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=4" title="Go to page 5"&gt;5&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-item"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=5" title="Go to page 6"&gt;6&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-item"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=6" title="Go to page 7"&gt;7&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-item"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=7" title="Go to page 8"&gt;8&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-item"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=8" title="Go to page 9"&gt;9&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-ellipsis"&gt;…&lt;/li&gt;
  &lt;li class="pager-next"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=1" title="Go to next page"&gt;next ›&lt;/a&gt;&lt;/li&gt;
  &lt;li class="pager-last last"&gt;&lt;a href="/resource-multi-category-search?&amp;amp;&amp;amp;field_resourcecategory_value=All&amp;amp;&amp;amp;page=154" title="Go to last page"&gt;last »&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/div&gt;
Bootstrap centers the pagination by wrapping it in a &lt;div class="text-center"&gt;&lt;/div&gt;
There are definitely a few ways of doing something like this, only going to list the main two.

At the theme level you would want to override theme_pager in your template.php with special attention being paid on the return statement.

Original theme_pager() return (see link above):
    

return '&lt;h2 class="element-invisible"&gt;' . t('Pages') . '&lt;/h2&gt;' . theme('item_list', array(
  'items' =&gt; $items,
  'attributes' =&gt; array('class' =&gt; array('pager')),
));


Modified theme_pager() return to center pagination (taken from Bootstrap Theme):
    

return '&lt;div class="text-center"&gt;' . theme('item_list', array(
  'items' =&gt; $items,
  'attributes' =&gt; array('class' =&gt; array('pagination')),
)) . '&lt;/div&gt;';


Looking at the code between these you can see that all that is added is the text-center wrap, plus the Bootstrap theme actually uses the pagination class from Bootstrap unlike Bootstrap Business (seems like a weird thing to say when I said it out loud).

I couldn't actually get the other CSS answer to work with the demo of the Bootstrap Business theme but that doesn't mean that it won't or is wrong per say. Just incase you have an issue with that one here is one that I got to work with the demo site:

ul.pager li a, ul.pager li.pager-current {
  display: inline-block;
}
.item-list ul.pager li {
  float: none;
}


That being said I would go with the way Bootstrap does this, it's already proven and holds up better than changing those lines of CSS I believe.