Styling <asp:Button /> with CSS

Question

I have a asp:Button, I used css styles with cssClass property in asp:Button, but those styles are not working.

This is my asp button:

<tr>
    <td>
        <div class="form_row">
             <asp:Button ID="ButtonSend" CssClass="BtnSend" runat="server" Text="Send" OnClick="ButtonSend_Click" />
        </div>
    </td>
</tr>

This is my CSS:

.BtnSend {
  width: 53px;
  height: 24px;
  display: block;
  float: right;
  margin: 0 0 0 10px;
  background: url(../../Images/contact_bt.gif) no-repeat center;
  text-decoration: none;
  text-align: center;
  line-height: 24px;
  color: #fff;
}

If I'm not wrong, I should use something like this:

input[type="submit"]
{
 //css coding
}

but I don't know where to put it and how to affect only this button.

How does the buttons html look like when rendered in browser? — Asons
– Asons, Commented Mar 4, 2014 at 14:03
<input type="submit" ... value="Send"... class="BtnSend" /> here it is. — user2969489
– user2969489, Commented Mar 4, 2014 at 14:12
Your css seems to be working fine. DEMO HERE. You'll see your button on the top right corner. That's what your css tells it to do. — Dumisani
– Dumisani, Commented Mar 4, 2014 at 14:16
Yes but the button still looks like a default button because the background: url(../../Images/contact_bt.gif) no-repeat center; is an image with rounded corners which is not showing them. It looks like an image inside a default button without rounded corners. — user2969489
– user2969489, Commented Mar 4, 2014 at 14:29

Asons · Accepted Answer · 2014-03-04 14:34:53Z

1

Based on your comment, add/change this in your css:

.BtnSend {
  border: none;
  background: transparent url(../../Images/contact_bt.gif) no-repeat center;
}

answered Mar 4, 2014 at 14:34

Asons

87.7k12 gold badges119 silver badges175 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Styling <asp:Button /> with CSS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related