input与canvas在一行但是对不齐问题

代码如下

<el-form-item prop="code">
    <el-input
      v-model="code"
      placeholder="请输入验证码"
      clearable
      style="width:156px"
      class="inp"
      @keyup.enter.native="submitForm('form')"
     ></el-input>
     <canvas id="canvas" width="92px" height="40px" @click="handleCanvas" class="code"></canvas>
</el-form-item>

只需要在canvas的样式中加vertical-align即可

.code {
  background: #fff;
  opacity: 1;
  margin-left: 12px;
  vertical-align: top;
}