Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to place a link inside <input> field?

Tags:

html

css

forms

Is it possible to place links on Login and on Register here?

<input type="text" class="formcontrol" value="Please Login or Register to view your tracking link.">
like image 857
user3187469 Avatar asked Jan 12 '14 16:01

user3187469


People also ask

How do you make a link in text field?

Create a hyperlink to a location in another documentPress Ctrl+K. You can also right-click the text or picture and click Link on the shortcut menu. Under Link to, click Existing File or Web Page. In the Look in box, click the down arrow, and find and select the file that you want to link to.

Can we use HREF in input tag?

In HTML Anchor tag's href attribute, we have to give our Another Web page's link (Where we want to Link out Input type submit Button). To Link HTML Input type submit to another page using HTML Form tags, we have to declare/write our HTML input type submit button between HTML Form Tag's Starting and Closing Tags.

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.


2 Answers

The <input> element may not have a close tag

Tag omission in text/html:
    No end tag.

which means it may not contain HTML.

On top of that, it is Interactive Content, which means that it is not allowed to contain <a> elements (or any other Interactive Content). <textarea> is interactive content as well, so the following will not work either:

<textarea>Please <a...>Login</a> or <a...>Register</a> to view your tracking link.</textarea>

If you want to use a placeholder for the field that includes links, you'll need to style an element to look like an <input> element:

input,
.input {
  border: 1px solid #888;
  box-sizing: border-box;
  display: block;
  font-family: sans-serif;
  font-size: 14px;
  line-height: 20px;
  margin: 10px 0;
  padding: 2px 5px;
  vertical-align: baseline;
  width: 300px;
}
<input type="text" value="Looks like an input"/>
<div class="input">Looks like an input, <a href="#">but isn't</a></div>
like image 178
zzzzBov Avatar answered Sep 18 '22 08:09

zzzzBov


according to w3c, the end tag is forbidden on an input tag this means that you cannot place any element inside of an input tag

http://www.w3.org/TR/html401/interact/forms.html

like image 21
iamkrillin Avatar answered Sep 21 '22 08:09

iamkrillin