Button disabled but looks active

Question

So I have a button that is currently set to disabled, and in IE it is greyed out, but in Firefox, Chrome and Safari, it is disabled but still looks active.

Button code

<tr valign="middle">
    <td colspan="2" style="width: 100%">
        <asp:Button ID="DownloadButton" runat="server" Text="Download" Width="85px" CssClass="ESTableHeaderL" OnClick="DownloadButton_Click" />
    </td>      
  </tr> 

And my code behind

protected void DownloadButton_Click(object sender, EventArgs e)
{        
    if (ddBusinessMonth.Items.Count == 0)
    {
        DownloadButton.Enabled = false;
        ShowClientMessageBox("No Data found for downloading");
    }
....

}

Is there anything I can do to make it look the same as in IE?

Thanks

Answer 1

The :disabled selector can be used with CSS3

input[type="button"]:disabled
{
background:#dddddd;
}

Browser Compatibility:

 IE8+ FF1.5+ SA3.1+ OP9.2+ CH2+

For ASP.NET:

Add a CssClass attribute to your server-side button and refer it to the class containing the above CSS.

Answer 2

you could programatically assign a css class if its disabled

if (ddBusinessMonth.Items.Count == 0)
    {
        DownloadButton.Enabled = false;
        DownloadButton.CssClass = "disabledbutton";
        ShowClientMessageBox("No Data found for downloading");
    }

css

.disabledbutton{
    background-color:#ddd;
}