Increase size of html special characters (·) in an input placeholder - html

I have a bit of an odd request. I'm creating a form on WordPress using the plugin Gravity Forms. I would like to add a bullet point to the end of my placeholder. The only way I was able to do this is to put the special HTML character · in the placeholder field on the plugin which is a middle dot. It works, but the dot is pretty small and I would like to increase its size.
Here is what the plugin placeholder field looks like:
I tried to wrap the special character with a <span> with a class so I can edit it in CSS, but when I click save, the plugin automatically removes the <span> tags.
Here is a screenshot on what the plugin spits out on the site:
I would like to make that dot much larger.
Here is the HTML that the plugin spits out:
<input name="input_1" id="input_1_1" type="text" value="" class="medium" placeholder="Name ·">
Does anyone have any suggestions? Maybe some jQuery will work?
Thanks

You can use the password dot (●) or bullet (•) instead.
See the following comparison / examples:
<input type="text" placeholder="middledot ·"/>
<input type="text" placeholder="bullet •"/>
<input type="text" placeholder="password dot ●"/>

Related

HTML Form / Input Autocomplete off

Autocomplete has been causing me trouble for quite some time. It overlays buttons and search results which causes users to click it instead of a link on the webpage.
I have been searching the internet for solutions to this for literally years. None of them are both practical and work consistently. I have tried all the alternatives to "off" listed throughout the relevant Google searches.
Below I have uploaded a GIF. The GIF shows me triggering autocomplete on an input which has autocomplete set to off.
I then remove the name attribute of a separate input within the form and suddenly autocomplete switches off.
I also demonstrate that having the keyword "Company" in the placeholder seems to override autocomplete=off. However, this does not seem to override autocomplete=off in all situations.
In the below example I used a datepicker, but I can also reproduced the problem with simple text inputs.
Is there a reason behind this strange behavior?
One solution is to use type="search", however, this may not be the desired approach for all developers.
Thanks in advance.
Have you tried this ?
<input name="unm" id="unm" type="text" autocomplete="false" readonly onfocus="this.removeAttribute('readonly');" />
Try using a form method.
<form method="post" action="">
<div>
<label for="cc">Please work:</label>
<input type="text" id="cc" name="cc" placeholder="Enter a company here" autocomplete="off">
</div>

How to remove text auto save in html input

How to remove this text like history in my input can anyone teach me how to remove this i'm using laravel 5.5 blade template please see image below.
Click to see image
You can disable autocomplete
<input type="text" autocomplete="off"/>
Try adding the autocomplete="off" attribute to your input.

custom xpath for "id" "input box" doesn't return anything in firebug

This question might appear as duplicate of:
XPATH required for an input text field? but question is why my custom xpath is not working. Though it is working for buttons, plain text on page, links etc.
Here is the HTML of it:
<input id="uemail" class="input_text" type="email" value="" tabindex="1" size="30" name="user[email]" autofocus="autofocus" autocorrect="off" autocapitalize="off"/>
For this HTML I tried to find it in firebug, I wrote:
//*[text()[contains(.,'user_email')]]
//id[text()[contains(.,'user_email')]]
//*[id()[contains(.,'user_email')]]
but none of worked, what am I missing.
Reasons:
1. Because, You are looking for text using text() but there is no text(as per given HTML), like you might have in links, buttons, plain text on page etc,so remove it.
2. after 'contains' you are looking for all elements just look for its type i.e. id
3. third you know that it's an input field so use * or input. * means any and input means that this is an input box.
So, finally it becomes://input[contains(#id,'user_email')]. Which I am sure will work.

How to print text above a line?

I have to make a UI of a reciept page, in which I have to print text above the line.
Here is an example image:
The option of showing underline below text by using text-decoration property is not working as it just displays line under the text. I also tried by setting border-bottom of the table but it is not working either.
What I need to do is to draw a lengthy horizontal line and I can print text above it. How can I achieve this desire result?
I need it to be IE > 7 compatible.
Consider using input fields with a border-bottom style declaration. Also, since the fields are meant for display purposes only, you should set them with the readonly attribute, so users cannot alter their contents.
For example:
HTML
<input type="text" value="some text goes here" readonly>
<input type="text" value="another field" readonly>
<input type="text" value="some more" readonly>
<input type="text" value="1234" readonly>
CSS
input {display:block;border:none;border-bottom:1px solid #000;}
See jsFiddle demo
Note the values of the fields should be properly escaped before they are included in the HTML. For example, in PHP the values can be escaped with the htmlspecialchars() or htmlentities() functions.

one click removing the entire text from a text-field

I have the following codes, its part of the application I am building for iPhone/android phones.
<li><span>X</span><input type="text" pattern="[0-9]*" id="anum" maxlength="9" placeholder="Account Number""/></li>
<li><span>X</span><input type="text" id="bname" placeholder="Beneficiary Name" /></li>
the "X" between the spans is suppose to appear when on a keyboard a button is pressed. after the "x" has appeared the user can remove the entire text in that field by pressing on the "x". when there is no element in the field at all, the "x" is not visible. But i cant make it happen.
I am using webapp-net. I would be glad if some could help me with this.
I'm not either quite familiar with WebApp.Net, but you might consider on using a form and a reset button, such as:
<input type="button" value="X" onClick="this.form.reset()" />
or something like:
<input type="reset" value="X">
inside of a <form> with the rest text inputs, and having in mind an html-like enviroment (even thought this might not clear a radio/checkbox inputs).
If I haven't got you wrong, you might also consider on looking if there is something like placeholders for textareas and/or text inputs on that framework. Good luck.