HTML – 如何禁用复选框周围的文本环绕

HTML – 如何禁用复选框周围的文本环绕,第1张

概述如何防止文本环绕复选框?我需要在复选框后对齐文本,而不是在它下面.我知道我不是第一个问的人,但我似乎无法找到解决方案. http://jsfiddle.net/csYPu/77/ .sign-newsletter {padding:40px;width:200px;}form li {display:inline;}fieldset {border:0;}.checkbox { 如何防止文本环绕复选框?我需要在复选框后对齐文本,而不是在它下面.我知道我不是第一个问的人,但我似乎无法找到解决方案.

http://jsfiddle.net/csYPu/77/

.sign-newsletter {padding:40px;wIDth:200px;}form li {display:inline;}fIEldset {border:0;}.checkBox {wIDth: 13px;height: 13px;padding: 0;margin:0 10px 0 0;vertical-align: bottom;position: relative;top: -2px;*overflow: hIDden;}input {background:#636566; padding:7px;wIDth:100%;margin-bottom:5px;-webkit-Box-sizing: border-Box; /* Safari/Chrome,other WebKit */-moz-Box-sizing: border-Box;    /* firefox,other Gecko */Box-sizing: border-Box;         /* Opera/IE 8+ */}<div ><form method="post" action="submit-sign-newsletter.PHP">    <fIEldset>        <ul>            <li><input type="text" name="name" placeholder="name" /></li>            <li><input type="email" name="email" placeholder="Email" /></li>            <li><input  type="checkBox" name="sign_me_in" value="" /><label>"Lorem ipsum dolor sit amet,consectetur      </label></li>            <li><input type="submit" value="submit"  /></li>        </ul>    </fIEldset></form></div>
解决方法 尝试改变:

HTML

<li>    <div >       <input  type="checkBox" name="sign_me_in" value="" />       <label>"Lorem ipsum dolor sit amet,consectetur</label>    </div></li>

CSS

.chkLabel input { float: left; margin-top:0.5em;}.chkLabel label { display: block; margin-left: 1.5em;}

DEMO

总结

以上是内存溢出为你收集整理的HTML – 如何禁用复选框周围的文本环绕全部内容,希望文章能够帮你解决HTML – 如何禁用复选框周围的文本环绕所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/1108665.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-29
下一篇 2022-05-29

发表评论

登录后才能评论

评论列表(0条)

保存