ASP.NET How to remove 'style' attribute from input type='image' control ?

Question

i am using an asp:ImageButton server control; i set the CssClass attribute to my CSS style, in which i defined border:solid 1px red;

.NET automatically renders an inline 'style' attribute as follows:

 style="border-width:0px;"

Q1. Can i remove the automatic inline 'style' ? e.g. on the PreRender perhaps inspect the HTML and edit it? I have tried Attributes.Remove("style") but this does not work (strangely enough does not error either), and i remember reading somewhere i can only remove the attributes that i added manually.

My workaround was to assign BorderWidth=1px property in the aspx page, but what's the point in providing a CssClass property if it's going to be overridden anyway (automatically!) Bug or Feature?

Answer 1

post render you can remove it with JQuery.

$(document).ready(function() { $("img").removeAttr('style'); }

Replace the "img" with a css style selector -- but keep the quotes.

Actually, I do this a lot in asp.net to "fix" the default rendering of asp.net

Answer 2

The reason they do this is due to a legacy of HTML where images default to have borders when they have a <a> tag wrapping them. In most situations people don't want these borders which is why ASP.NET does what they do. In order to get around this, you can do the following in your style sheet (assuming you are setting cssclass='redborderbutton'):

.redborderbutton img
{
  border:solid 1px red !important;
}

Answer 3

You could use an HTML server control.

<input id="Image1" runat="server" name="ImageButton1" src="images\image.jpg" type="image" />

Answer 4

I'm having the same problem, i've tried using -

aspIMAGE.Style.Clear();

but this seems to have no effect

Answer 5

ASP is the hackiest set of tags ever. Even if border is "legacy," that can be addressed in CSS.