CODEWITHSUNDEEP
htmlcss
Mohammad Shahbaz
Mohammad Shahbaz

Reputation: 423

Remove space between two HTMl text box

Checked a lot of solution (give margin etc) but still got stuck. I want to remove space between two textbox or any other thing which I add in future.

Also once I click in textbox it's border is automatically changing the color that shouldn't happen.

.rz-map-address{
border: 1px solid lightgray;
height: 60px;
width: 25%;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}

.rz-datetime{
border: 1px solid lightgray;
height: 60px;
width: 10%;
}
<html>
<body>
<input type="text" name="rz_geo" value="" placeholder="city, airport, adress or hotel " class="rz-map-address" autocomplete="off" />
<input type="text" name="rz_geo" value="" placeholder="Date" class="rz-datetime" autocomplete="off" />
</body>
</html>

Upvotes: 2

Views: 674

Answers (1)

ruleboy21
ruleboy21

Reputation: 6353

  1. You can resolve the first issue by joining both of the inputs on the same line.
  2. For the last part, use input {outline: none}.

.rz-map-address {
  border: 1px solid lightgray;
  height: 60px;
  width: 25%;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

.rz-datetime {
  border: 1px solid lightgray;
  height: 60px;
  width: 10%;
}

input {
  outline: none;
}
<input type="text" name="rz_geo" value="" placeholder="city, airport, adress or hotel " class="rz-map-address" autocomplete="off" /><input type="text" name="rz_geo" value="" placeholder="Date" class="rz-datetime" autocomplete="off" />

Upvotes: 3

Related Questions