Как сделать такой input?

Question

[Юрий]

Не могу сделать так, чтобы фон был прозрачным и при этом border был виден.

Answer 1

[Elwen]

input {
  background: none;
  border: 1px solid rgba(255,255,255,.5);
}

Comments

[Юрий]

Спасибо, а вот насчет кнопки отправки, как ее лучше сделать? Я сделал через input img, но она почему то выше чем строка ввода

[Eugene Chefranov]

Юрий, через background сделайте

[Elwen]

Юрий, сделать такую кнопку можно несколькими способами. И через input(type="image"), и через фон - https://codepen.io/anon/pen/wxGVRw (как советует Eugene Chefranov ), и используя svg в качестве вложенного элемента или фонового изображения. Используйте что вам удобнее.
В любом случае, на сколько я понимаю, проблема заключается в положении самой кнопки относительно инпута. И скорее всего у вас оба элемента идут с display: inline-block. Тогда допишите обоим одинаковое vertical-align: middle. И проверьте у элементов и родителей отступы, возможно они мешают. Точнее подсказать без кода сложно.

[Юрий]

Elwen, Спасибо, я уже сделал)