Remove border-width:0px from asp:Image or asp:ImageButton
First off hello all and here is my first code post and bug fix
This in fact is a **bug** even if intentional when developing the <asp:Image /> and also the <asp:ImageButton /> tags
The issue that has been brought up in many forums recently and discussions are popping up all over the place regarding the asp image control and now also the image button has the same issue.
Let me explain. Have you ever run through your HTML source view in your browser to check on how things are being compiled and distributed to the browser in HTML. If you run a standard asp:image tag you will find it has given itself a style attribute border-width:0px
Now this is ok unless you wanted to apply a cssClass or used an attached css to give the image another border. When the clash comes about you can end up with no styling and in some cases no image.
There is a way around this.
1. Use an <img> tag instead.
or
2. Create your own image control over-ride (class)
Now this is not something you need to reference anywhere else and it will in fact make every <asp:image> return with no border style attributes.
C# Code - For the Pros
Borderless Image Class
using System;
using System.Web.UI.WebControls;
public class BorderlessImage : Image
{
public override Unit BorderWidth{
get
{
if (base.BorderWidth.IsEmpty)return Unit.Pixel(0);else
return base.BorderWidth;}
set
{
base.BorderWidth = value;}
}
}
Borderless Image Button Class
using System;
using System.Web.UI.WebControls;
public class BorderlessImageButton : ImageButton
{
public override Unit BorderWidth
{
get
{
if (base.BorderWidth.IsEmpty)
return Unit.Pixel(0);
else
return base.BorderWidth;
}
set
{
base.BorderWidth = value;
}
}
}
VB Code - For Rookies
Borderless Image Class
Imports Microsoft.VisualBasic
Public Class BorderlessImageInherits System.Web.UI.WebControls.Image
Public Overrides Property BorderWidth() As System.Web.UI.WebControls.UnitGet
If MyBase.BorderWidth.IsEmpty ThenReturn Unit.Pixel(0)Else : ReturnMyBase.BorderWidth()End GetEnd If
Set(ByVal value As System.Web.UI.WebControls.Unit)
MyBase.BorderWidth = valueEnd SetEnd Property
End Class
Borderless Image Button Class
Imports Microsoft.VisualBasic
Public Class BorderlessImageButtonInherits System.Web.UI.WebControls.ImageButton
Public Overrides Property BorderWidth() As System.Web.UI.WebControls.UnitGet
If MyBase.BorderWidth.IsEmpty ThenReturn Unit.Pixel(0)Else : ReturnMyBase.BorderWidth()End GetEnd If
Set(ByVal value As System.Web.UI.WebControls.Unit)
MyBase.BorderWidth = valueEnd SetEnd Property
End Class
Ad tag refrencess to web config- If not added then your code is useless (you can do this in page also)
<system.web>
<pages><tagMapping></pages><add tagType="System.Web.UI.WebControls.Image" mappedTagType="BorderlessImage"/><add tagType="System.Web.UI.WebControls.ImageButton" mappedTagType="BorderlessImageButton"/></tagMapping>
</system.web>
......
Recieved by X-Post from = http://www.spidermaster.org/blogs/spidermaster