S. Gandhi
S. Gandhi

Reputation: 119

How to add a css in vue-bootstrap table template

I want to add a CSS to bootstrap vue table template but it doesn't work

<template slot="actions" slot-scope="data" :style="{min-width:'150px'}">
    <b-button variant="info" @click="showViewModel(data.item)">
       <i class="fa fa-eye"></i>
    </b-button>
   <b-button variant="danger" class="ml-1" @click="showConfirmBox(data.item.id,data.index)">
       <i class="fa fa-trash"></i>
   </b-button>
</template>

Upvotes: 0

Views: 243

Answers (2)

S. Gandhi
S. Gandhi

Reputation: 119

 <template slot="actions" slot-scope="data">
    <div :style="'min-width:150px'">
      <b-button variant="info" @click="showViewModel(data.item)">
         <i class="fa fa-eye"></i>
      </b-button>
      <b-button variant="danger" class="ml-1" @click="showConfirmBox(data.item.id,data.index)">
       <i class="fa fa-trash"></i>
      </b-button>
    </div>
  </template>

Upvotes: 1

Ayrton
Ayrton

Reputation: 2303

Vue's template tag renders into nothing, so adding style to it has no effect.

Also, adding style with Vue you should use plain strings instead of objects. So instead of this:

:style="{min-width:'150px'}"

Use this:

:style="'min-width:150px'"

Upvotes: 0

Related Questions