如何在css中输入类型文本和输入按钮之间提供空间?

时间:2015-02-03 06:19:52

标签: html css

这是我的图片http://s7.postimg.org/l0ib3cbez/Untitled_2.png

此处输入类型文本和输入按钮之间没有空格。

如果我提供,margin-top,它不起作用。

HTML:

<form action="//holycrap.us10.list-manage.com/subscribe/post?u=86019d1f16af8d19cbc0de4ed&amp;id=ae25f1fcdc" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
<div id="mc_embed_signup_scroll">
  <div class="mc-field-group">
    <h3>Email Address </h3>
</div>

    <div class="frm-main">
        <div class="frmheader">
            <div class="bodyText"><img src="{{ 'email-sign-up-image-revised.jpg' | asset_url }}"></div>
        </div>
        <div style="padding-bottom: 5px;">          
            <input class="text" type="email" value="" name="EMAIL"  id="mce-EMAIL">
            <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="sidebar-button">  
      </div>
    </div>
  </div>
</form>

的CSS:

.frm-main input.text {
height: 29px;
background-color: #FFFFFF;
border-color: #D9D9D9;
border-width: 1px;
border-style: solid;
color: #000000;
text-decoration: none;
font-style: normal;
font-weight: normal;
font-size: 14px;
font-family: Trebuchet MS, sans-serif;
width: 219px;
margin-bottom: 10px;
}

.frm-main, input[type="submit"]{
border: medium none;
background: none repeat scroll 0% 0% #9F2214;
color: #FFF;
font-weight: 400;
font-size: 12px;
text-transform: none;
width:162px;
line-height: 1px;
}

有人可以帮我吗?

2 个答案:

答案 0 :(得分:0)

input[type="submit"]{
    margin-top:10px;
    display:block;
}

我已经编辑了我的答案,现在它正在运作; 我已经复制了原来的css行,但逗号给了.frm-main类相同的值,所以它们以某种方式合并。

答案 1 :(得分:0)

.frm-main{
background-color: white !important;
}
input{
min-height: 20px;
}
.frm-main input.text {
height: 29px;
background-color: #FFFFFF;
border-color: #D9D9D9;
border-width: 1px;
border-style: solid;
color: #000000;
text-decoration: none;
font-style: normal;
font-weight: normal;
font-size: 14px;
font-family: Trebuchet MS, sans-serif;
width: 219px;
margin-bottom: 10px;
}

.frm-main, input[type="submit"]{
border: medium none;
background: none repeat scroll 0% 0% #9F2214;
color: #FFF;
font-weight: 400;
font-size: 12px;
text-transform: none;
width:162px;
line-height: 1px;
}