如何消除2个内容之间的小差距?(How to remove small gap between 2 content?)
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} input[type="text"] { background-color: green; padding: 7px; font-family: helvetica, arial, sans-serif; font-size: 1.2em; margin-bottom: 20px; display: block; border: solid 2px #bbb; color: white; } input[type="submit"] { background-color:blue; font-family: helvetica, arial, sans-serif; font-size: 1.0em; font-weight:bold; padding: 7px; color: white; } input[type="submit"]:hover { background-color: #ff379f; color: #fafafa; } #subscription-email-text-field { vertical-align: top; display:inline-block; font-size:0.9em; font-weight:400; border:0; width:250px; height:32px; margin:0; } #subscribe-button { display:inline-block; border: 1px solid black; border-width:0px 0px 0px 1px; margin:0; height:32px; }<input type="text" id="subscription-email-text-field" name="email" placeholder="box 1"> <input type="submit" id="subscribe-button" value="subscribe">我有一个文本框和一个按钮,我想让它内联。 但不知何故,它们之间存在很小的差距。
我正在尝试设置填充和边距,但它不会改变
如何删除它? 所以它看起来像这样
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} input[type="text"] { background-color: green; padding: 7px; font-family: helvetica, arial, sans-serif; font-size: 1.2em; margin-bottom: 20px; display: block; border: solid 2px #bbb; color: white; } input[type="submit"] { background-color:blue; font-family: helvetica, arial, sans-serif; font-size: 1.0em; font-weight:bold; padding: 7px; color: white; } input[type="submit"]:hover { background-color: #ff379f; color: #fafafa; } #subscription-email-text-field { vertical-align: top; display:inline-block; font-size:0.9em; font-weight:400; border:0; width:250px; height:32px; margin:0; } #subscribe-button { display:inline-block; border: 1px solid black; border-width:0px 0px 0px 1px; margin:0; height:32px; }<input type="text" id="subscription-email-text-field" name="email" placeholder="box 1"> <input type="submit" id="subscribe-button" value="subscribe">I have a textbox and a button i want to make it inline. But somehow there is a small gap between them.
I'm trying to set up the padding and margin but it doesn't change
How to remove it ? So it will look like this
最满意答案
删除元素之间的空格。 两个input元素之间有一个空格,因此您将获得不需要的空间。
请尝试以下代码段
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} input[type="text"] { background-color: green; padding: 7px; font-family: helvetica, arial, sans-serif; font-size: 1.2em; margin-bottom: 20px; display: block; border: solid 2px #bbb; color: white; } input[type="submit"] { background-color:blue; font-family: helvetica, arial, sans-serif; font-size: 1.0em; font-weight:bold; padding: 7px; color: white; } input[type="submit"]:hover { background-color: #ff379f; color: #fafafa; } #subscription-email-text-field { vertical-align: top; display:inline-block; font-size:0.9em; font-weight:400; border:0; width:250px; height:32px; margin:0; } #subscribe-button { display:inline-block; border: 1px solid black; border-width:0px 0px 0px 1px; margin:0; height:32px; }<input type="text" id="subscription-email-text-field" name="email" placeholder="box 1"><input type="submit" id="subscribe-button" value="subscribe">Remove the space between elements. You have a space between the two input elements, so you are getting that unwanted space.
Try below snippet
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;} input[type="text"] { background-color: green; padding: 7px; font-family: helvetica, arial, sans-serif; font-size: 1.2em; margin-bottom: 20px; display: block; border: solid 2px #bbb; color: white; } input[type="submit"] { background-color:blue; font-family: helvetica, arial, sans-serif; font-size: 1.0em; font-weight:bold; padding: 7px; color: white; } input[type="submit"]:hover { background-color: #ff379f; color: #fafafa; } #subscription-email-text-field { vertical-align: top; display:inline-block; font-size:0.9em; font-weight:400; border:0; width:250px; height:32px; margin:0; } #subscribe-button { display:inline-block; border: 1px solid black; border-width:0px 0px 0px 1px; margin:0; height:32px; }<input type="text" id="subscription-email-text-field" name="email" placeholder="box 1"><input type="submit" id="subscribe-button" value="subscribe">
更多推荐
发布评论