javascript - 使用 BootstrapVue 的 VueJs Form textarea 和文本格式问题

标签 javascript css vue.js vuejs2 bootstrap-vue

我正在使用 BootstrapVue 构建一个包含两列的行。第一列有一个文本,第二列有一个 b-form-textarea .我还希望文本 ("data") 出现在文本区域的旁边。但文本仅显示在文本区域下方。我认为这是因为 b-form-textarea 的一些 css 属性。

这是我的 fiddle

但是,当使用普通 textarea 时,文本会出现在它旁边(请参阅下面的 fiddle /屏幕截图)。

我希望文本不仅在文本区域旁边,而且在文本区域一侧垂直居中。

注意:当根据您的屏幕宽度以 fiddle 方式查看时,两个文本都可能出现在底部。粘贴屏幕截图以避免混淆。

enter image description here

最佳答案

推荐使用vue-bootstrap layouts对齐你的元素,如:

  <div class="col-4">
        <b-row align-v="center" >
        <b-col cols="10">
          <b-form-textarea></b-form-textarea>
        </b-col>
        <b-col cols="2"> <span> data </span></b-col>
      </b-row>
    </div>

关于javascript - 使用 BootstrapVue 的 VueJs Form textarea 和文本格式问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57714294/

相关文章:

javascript - 为多个实例使用复选框

javascript - 如何在 VueJS 的方法中访问表单变量

javascript - Jquery 使用图像作为复选框

javascript - JQuery UI拖放后查找列表中元素的索引

javascript - react 测试库验证DOM嵌套错误

html - Bootstrap 3- Div 堆叠在手机上或浏览器调整大小 - 没有水平滚动条

javascript - onclick 属性未按预期工作

html - 为什么我的 CSS 样式表不起作用?

javascript - vue + nuxt.js - 如何根据域具有不同的样式?

responsive-design - Vuetify.js 响应式 v-toolbar 不触发打开/关闭事件