I need help with Newsletter form

Community Off Topic
1

Can You please help me, I’m new at this? I made this newsletter form and I can’t style it so there is no space between the input field and the button.
Here is my code:

710×212 33.9 KB

Can anyone help me!?

2

Could you copy and paste your code to the forum? Then i can run it, now i would have to retype it all in other to see where the problem is

3

This is html:

 
      <form action="" method="post" id="newsletter">
        <input type="email" name="email" class="subscribe-input" placeholder="Your mail">
       <button id="subscribe-submit">Subscribe</button>
      </form>

and this is css:


#newsletter {
  font-family: "Varela Round";
  font-size: 16px;
}
.subscribe-input {
  padding-left: 20px;
  width: 190px;
  height: 50px;
  color: #999;
  background-color: #333;
  border: none;
  display: inline-block;
  text-align: left;
}
#subscribe-submit {
  padding-left: 20px;
  height: 50px;
  width: 110px;
  color: #ccc;
  background-color: #4d4382;
  border: none;
  cursor: pointer;
  display: inline-block;
  text-align: left;
}
4

I should have seen it coming, anyway, the gap is caused by your use of (not that i give you the blame for this) inline-block, there are multiply ways to solve this, for example this(in case you don’t see it, added a comment in html, yes, inline-block only creates a gab if there is space between the html elements), or you could decide to use float, and so on. Anyway, someone wrote this guide, which in detail describes your problem, and the possible solutions

5

Thank You so much for a reply. I will go with a comment in html solution.