HTML CSS Invisible Button

button, css, html, invisible

Solution

you must use the following properties for a `button` element to make it transparent.

Transparent Button With No Text

button {

    background: transparent;
    border: none !important;
    font-size:0;
}

Transparent Button With Visible Text

button {

    background: transparent;
    border: none !important;
}​

and use absolute `position` to position the element.

For Example

you have the button element under a div. Use `position` : relative on div and `position`: absolute on the button to position it within the div.

here is a working JSFiddle

here is an updated JSFiddle that displays only text from the button.

Problem

Hello I am trying to make an invisible button (still functional and clickable), because my buttons styles are embedded in the background and I don't want to slice them, and do it all from beginning. So I just want to make a button, put it on the part of the background where the button should be and make it invisible so the background button image can be seen and clicked. Any suggestions? Thank you very much!

Original source