Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add button inside input [closed]

I am trying to achieve this: enter image description here

I just want to show a button inside an input element just like the above image

like image 378
Vlad Otrocol Avatar asked Mar 09 '13 18:03

Vlad Otrocol


People also ask

How do I add a close button to a text box?

The easiest way to add an input box with a clear button is to add an input element with the type attribute set to search . Then when we type into the input box, we see the clear button displayed. And we can click on it to clear its value.

Can you put elements inside input?

No, you cannot have any element contained within an <input> element. It is an empty (void) element, and the closing tag must be ommitted. Thus you cannot have any element contained within it.

Can we put span inside input?

Wrap both your input and your span inside a container, position this container as relative, and the span as absolute. You can now do whatever you like with the span.


1 Answers

The button isn't inside the input. Here:

input[type="text"] {     width: 200px;     height: 20px;     padding-right: 50px; }  input[type="submit"] {     margin-left: -50px;     height: 20px;     width: 50px; } 

Example: http://jsfiddle.net/s5GVh/

like image 124
Alfo Avatar answered Sep 29 '22 01:09

Alfo