Totally invisible html buttons

html button input visibility invisible
VVWdefect picture VVWdefect · Apr 21, 2011 · Viewed 64.6k times · Source

Use the following code:

<html>
<body>
<input type="submit" style="color: transparent; background-color: transparent; border-color: transparent; cursor: default;">
</body>
</html>

Save this file as a html file. If you open the file there is an invisible but still active button. Press Tab to select the button. Now there is a grey dotted rectangle arround the still invisible button. Can someone help me to disable that rectangle. Thanks to responders

I'm trying to make a totally invisible site login, that's the only visible part of it, please help.

Answer

McHerbie picture McHerbie · Apr 21, 2011

You can use the style outline: 0; to disable the dotted rectangle from the button when it's focused.

Example:

<input type="submit" style="outline: 0;">

Though, I'm not sure what you are trying to do is correct... Are you just trying to hide the button? Your best bet is to use display: none;

Example:

<input type="submit" style="display: none;">

Related questions

HTML: How to make a submit button with text + image in it?

I would like to have a submit button which contains text and an image. Is this possible? I can get the exact look I want with code that looks like: <button type="button"> <img src="save.gif" …

Read More
How to trigger HTML button when you press Enter in textbox?

So the code that I have so far is: <fieldset id="LinkList"> <input type="text" id="addLinks" name="addLinks" value="http://"> <input type="button" id="linkadd" name="linkadd" value="add"> </fieldset> It …

Read More
Input button target="_blank" isn't causing the link to load in a new window/tab

I have an HTML file with an input button. This is only an example button, but it's including all necessary info of code: <input type="button" onClick="parent.location='http://www.facebook.com/'" value="facebook" target="_blank"> …

Read More