html - Materialise CSS 中的居中复选框/单选按钮

标签 html css material-design materialize

我在使用 Materilize CSS 使复选框居中对齐时遇到问题。

<div class="center-align">

    <h5>Select Value </h5>

    <form action="#" >

            <p class="center-align">
              <input class="filled-in" name="group1" type="checkbox" id="1">
              <label for="1" class="teal-text text-lighten-2" >First</label>
            </p>
            <p class="center-align">
              <input  class="filled-in"name="group1" type="checkbox" id="2">
              <label for="2" class="teal-text text-lighten-2">Second</label><span></span>
            </p>
    </form>

enter image description here

这导致复选框在中心对齐,但彼此偏移。如果标签完全相同,则它们匹配。

我尝试将中心对齐类添加到 <div> , <form> , <input><p>但没有像我期望的那样工作。

最佳答案

通过添加这个 css 能够达到预期的结果

<style>
      label{  
          left: 50%;
        }   
</style>

关于html - Materialise CSS 中的居中复选框/单选按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49060421/

相关文章:

html - Visual Studio HTML 格式化程序 : Hitting enter removes all indents in the previous line

html - 为什么这个 div margin-top 没有按预期工作?

HTML CSS 按钮文本对齐不起作用

material-design - MDL : Changing Color of Indeterminate Progress Bar?

html - 浏览器拆分 <p> 和包含嵌套 <p> block 的嵌套 <code> block 。为什么?

javascript - 触摸设备上的粘性侧边栏

IE 11 中的 jQuery SlideUp() 和 SlideDown() 不起作用

firefox - -moz-列跨度 : all; – completely ignored?

javascript - 如何使用按钮返回 javascript(Angular Material)的最后一个选项卡?

android - Android Studio 生成的 Apk 文件太大