Add a right-text in a input area - html

I must have this input with a text on the right.
So, it isn't a placeholder, it's a real input.
To do this, I must add a div for the text ?
I sought on the web but I didn't find any code :-(

You need to add value="something" and to pull it to the right, you need to add style="text-align:right"
<form>
<input type="text" style="text-align:right" value="abcd"><br>
<input type="text" style="text-align:right" value="efgh"><br>
<input type="submit" value="Submit">
</form>

Related

<input type="text"> does not allow resizing

I can't figure out why my input does not allow me to resize it.
<input type="text">
Example of the problem
I only want to have a working resize on my biginput class.
That's simply because <input type="text"> is ment for a single line.
You'll need to use <textarea></textarea> for this.
<input type="text" placeholder="I can't be resized"></input>
<textarea>I can be resized</textarea>
In order to do this in Google Forms, use the option 'Paragraph Text' instead of 'Text' when selecting an answer.
You need textarea for that :-
<textarea name="entry.585452596" type="text" class="biginput"></textarea>

HTML Submit button don't work

I recently started HTML and made my first Website. I made bunch of lines of codes, and the last line is: <input type="submit" name="register" value="Register" action="Registered.html">. I wanted to this submit button named as "Register" to get me to the my "Registered.html" file but something isn't right. The button shows up, and it's valued as "Register" but `action="Registered.html" doesn't work. I hope you understand me, if you can, fix this for me.
The form element takes the action attribute, not the input:
<form action="Registered.html">
<input type="submit" name="register" value="Register">
</form>
<form action="/action_page.php">
First name:<br>
<input type="text" name="firstname" value="Mickey">
<br>
Last name:<br>
<input type="text" name="lastname" value="Mouse">
<br><br>
<input type="submit" value="Submit">
</form>
notice the action is at the form..
refer https://www.w3schools.com/html/tryit.asp?filename=tryhtml_form_submit
In general form elements are used to send data to a server. It wraps around the elements which specifies the data, input or button elements, for instance. If you add a name and a value attribute to your input and button elements, you will send this name-value-pair to your server.
If you don’t need to send any (additional) data to your server, just use anchor elements:
Register
<form>
<input type="submit" formaction="Registered.html" value="Register">
</form>
The formaction attribute of the input tag is not supported in Internet Explorer 9 and earlier versions.

Avoiding user's input in input type for jsp

The code shown below will prevent the user from entering any value in input type. Is there a way the box can be hidden in this case.
<input id="vendor" name="vendor" type="text"
class="txtsmall2" value="<%=variable%>" readonly="readonly"/>
I think you're looking for something like:
<input id="vendor" name="vendor" type="hidden"
value="<%=variable%>" /><span class="txtsmall2"><%=variable%></span>
Where you have a hidden input followed by a visible text element that is not an input but has the same value.
Changing type to hidden would hide the input field.
<input id="vendor" name="vendor" type="hidden"
class="txtsmall2" value="<%=variable%>" readonly="readonly"/>
As OP mentioned in a comment, if want to show the text content but not the borders, try:
<input style="border:0" "id="vendor" name="vendor" type="text"
class="txtsmall2" value="abc" readonly="readonly"/>
CSS can be in-line, internal, or external sheet. I kept it simple here.

Labels Causing Text Boxes to Deselect

I am learning how to make forms and made this for practice. When I have labels out it and try to click into any of the form elements, it selects the previous one. For example, if I click into the password input box, it sends me to the username input box. When I remove the labels the bug goes away. I'm pretty sure labels aren't supposed to do this. The console isn't showing any errors so I'm confused to why this is acting up.
Here is my code:
<form action="">
<fieldset>
<label>username<label>
<input type="text" id="userInput"/>
<label>password<label>
<input type="password" id="passwordInput"/>
<label>Hidden<label>
<input type="hidden" id="hiddenInput" value="I can't tell you"/>
<label>Text Area<label>
<textArea id="areaInput" rows="10" cols="40">
This is a big area with lots of text.
</textArea>
<input type="button" onClick="" value="submit"/>
<fieldset>
<form>
Looks like you are not closing your label tags, so you are making another label. You need to close the <label> by using </label> - just a typo!
You're not closing out your <label> tag. Use the / slash on the closing tag:
<label>username</label>

text field with attached button

How do I get the textfield and button attached to each other
Here is my demo
http://jsfiddle.net/dgWqL/2/
You can simply remove the whitespace between #textfield" and input[type="button"].
(Whaaat?) Well, this is your html:
<input type="text" name="textfield" id="textfield" value="Search here" />
<input name="" type="button" value="Go">
This is the same as having...
abc
def
...which, as you'd never question, gets rendered as abc def.
It's the exact same thing.
As I've suggested you can simple delete that whitespace by putting the second input right in front of the first one in the html, as so...
<input type="text" name="textfield" id="textfield" value="Search here" /><input name="" type="button" value="Go">
Another option is to comment out the whitespace - that's if you prefer to have each input on it's own line:
<input type="text" name="textfield" id="textfield" value="Search here" /><!--
--><input name="" type="button" value="Go">
Here's a fiddle - http://jsfiddle.net/dgWqL/3/
You can do it this way : http://jsfiddle.net/dgWqL/2/ The key is using float
Suggestion:
Do not use table for layout. (It is bad practice.)
Write your CSS properties on separate lines. (Easier to read) and make it easier to
avoid repeatition like you did with display: inline-block;
Hope this help.