vux cell为什么title没有居左

Question

跟文档上一样的 样式效果却不同 怎么回事。。。。
而且高度变大了很多

<group>
      <cell title="消息中心">
          <span slot="default"><span style="vertical-align:middle;"></span> <badge text="99"></badge></span>
      </cell>
      <cell>
          <span slot="title" class="edit-left">手机号码</span>
          <span slot="default">{{phone}}</span>
      </cell>
      <cell title="第三方登录授权" >
          <span slot="default"><img class="icon" slot="icon" src="../../assets/wx_icon.png"></span>
      </cell>
      <cell title="登录密码">
          <span slot="default"></span>
      </cell>
  </group>

单独建一个demo，什么样式 方法都没有写 直接引入的vux 的组件 显示的都有问题

<template>
  <div>
      <group>
          <cell title="cell" value="hello" is-link></cell>
          <cell-box is-link>
              cell-box long long long long long long long
          </cell-box>
          <cell-box>
              cell-box hello world hello world hello world
          </cell-box>
          <cell title="cell" value="hello" is-link></cell>
      </group>
  </div>
</template>

<script>
    import { Group,Cell,CellBox,Badge ,TransferDom } from 'vux'

export default {
    directives: {
        TransferDom
    },
  data () {
    return {
        menus: {
            menu1: '退出登录'
        },
        phone:'',
        showMenus: false
    }
  },
    created(){

    },
    components: {
        Group,
        Cell,
        CellBox,
        Badge
    },
    methods:{

    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>


</style>

Answer 1

样式可能被你自己写的覆盖了，导致元素变型，使用调试工具查看一下css应该就能看出来了。我直接复制过来是没有这个问题的。
PS：如果有内容要插在默认插槽可以不用写slot=default，组件会自动将内容插入对应位置

Answer 2

样式被覆盖 ，检查app.vue 里面发现有

text-align:center;

去掉就好了