Hey guys, trying to make a website, and I'm having trouble with image buttons.

Here is my code

<div>
<a id="Home Button" style="padding: 0; border:0" href="http://ogbhop.aoudevcommunity.com/index.php" title="OG Clan Forum" >
<button><img src="homebutton.png" style="border:none; padding:0; background:transparent;"></button>
</a>
</div>


My problem, even though I'm specifying no border, no padding, and transparent background , Im STILL getting a border on my images! I've swapped "none" and "0" for everything, still doesn't work. I've moved style around still not working like I want it to. Really irritating

Any help GREATLY appreciated!

you have to use a style on button

<div>
<a id="Home Button" style="padding: 0; border:0" href="http://ogbhop.aoudevcommunity.com/index.php" title="OG Clan Forum" >
<button style="padding: 0; border: none;" ><img src="homebutton.png" padding:0; background:transparent;"></button>
</a>
</div>

This post was edited by labatymo on Jun 19 2013 02:41pm

AH! THANK YOU! I figured out what I did wrong!


<div>
<a id="Home Button" href="http://ogbhop.aoudevcommunity.com/index.php" title="OG Clan Forum" >
<button style="padding: 0; border: 0; background:transparent;" ><img src="homebutton.png"></button>
</a>
</div>

This worked perfectly!

wtf.

just do this.

Agreed man.

The idea of writing the code is, the less you have to do, the better. The more you write the more mistakes can happen.

Only style in the CSS mate and not inside your html tags as it starts to get messy