title: Vue.js, bootstrap-vue, <b-table> element vertical align
body: <p>Hi I would like to align vertically element in my b-table inside my vue/bootstrap project.</p>
  <p>My code:</p>
  <pre><code>    &lt;template&gt; 
        &lt;b-table small :fields=&quot;fields&quot; :items=&quot;items&quot; responsive=&quot;sm&quot;&gt;
  
          &lt;template #cell(name)=&quot;data&quot;&gt;
            &lt;b class=&quot;text-dark&quot;&gt;{{ data.value }}&lt;/b&gt;
          &lt;/template&gt;
  
          &lt;template #cell(utility)=&quot;data&quot;&gt;
            &lt;b class=&quot;text-dark&quot;&gt;{{ data.value }}&lt;/b&gt;
          &lt;/template&gt;
  
          &lt;template #cell(icon)=&quot;data&quot;&gt;
            &lt;img v-bind:src=&quot;data.value&quot; alt=&quot;....&quot; width=&quot;50&quot; height=&quot;50&quot;&gt;
          &lt;/template&gt;
        &lt;/b-table&gt;
        .....
      &lt;/template&gt;
  
      &lt;script&gt;
      ......
        data () {
          return {
            fields: ['name', 'utility', 'icon'],
            items: [
              { name: '.....', utility: '.....', icon: '/img/......a6c26916.png' },
              { name: '.....', utility: '.....', icon: '/img/......5233a552.png' },
              { name: '.....', utility: '.....', icon: '/img/......96e5850d.png' },
              { name: '.....', utility: '.....', icon: '/img/......41bab77c.png'}
            ]
          }
        }
      ......
      &lt;/script&gt;
  </code></pre>
  <p>How can I align vertically the &quot;<code>&lt;b&gt;...&lt;/b&gt;</code>&quot; text?<br />
  By default bootstrap sets the vertical-align: top for  and  elements.</p>
  <p>Thanks</p>