[Vue.js] text-align

버튼이 왼쪽에 있었는데 오른쪽으로 옮기고 싶었다.

<el-row class="filter-item" style="margin-left: 600px">
  <el-button
    v-waves
    :loading="dataLoading"
    class="filter-item"
    type="primary"
    plain
    icon="el-icon-edit"
    @click="closePopup()">
    {{ $t('btn.cancel') }}
  </el-button>
  <el-button
    v-waves
    :loading="dataLoading"
    class="filter-item"
    type="primary"
    plain
    icon="el-icon-edit"
    @click="createShortUrl()">
    {{ $t('btn.add') }}
  </el-button>
</el-row>

margin-left: 600px 을 하니 내 컴퓨터 화면에서는 딱 오른쪽으로 이쁘게 위치해 있었다.

그래서 된줄 알았는데... 

다른 모니터에서는 중간에 가있질 않나... 뒤죽박죽이었다.

차라리 px 대신 %를 주던가... 그럼 어느정도는 가있었을텐데...

<el-row class="filter-item" style="text-align: right">
  <el-button
    v-waves
    :loading="dataLoading"
    class="filter-item"
    type="primary"
    plain
    icon="el-icon-edit"
    @click="closePopup()">
    {{ $t('btn.cancel') }}
  </el-button>
  <el-button
    v-waves
    :loading="dataLoading"
    class="filter-item"
    type="primary"
    plain
    icon="el-icon-edit"
    @click="createShortUrl()">
    {{ $t('btn.add') }}
  </el-button>
</el-row>

text-align: right 로 간단히 해결!