Solved

CSS style to make form button look like normal

Posted on 2009-05-05
3
794 Views
Last Modified: 2012-08-13
I'm supplying the code for a simple form for another department to add to one of their web pages.
The problem is, they've code some mass-complicated css going on and it's making the buttons look like black text on an orange background (which is how they've set it up for other forms on their website with a "INPUT[type=button]" definition)  I want my button to look "normal"  So I can override their style sheet with some inline css
like this:
<input type="button" name="one" value="1" style="xxxxxxx" />

Problem is, I can't figure out how to 'style' a button to look like the defaults of a form button without using images.
Can anyone help, even getting me close would be great.

Thanks!
0
Comment
Question by:dban00b
3 Comments
 
LVL 1

Accepted Solution

by:
salamay earned 250 total points
ID: 24308843
Hi,

Try This

.specialbutton
{ border: font-size: 11px; color: #FFFFFF; font-weight: normal; font-family: arial; background-color: #CC0000; text-decoration: none;
}

<input type="submit" value="Submit form" class="specialbutton">

Hope it works
Salamay
0
 
LVL 3

Assisted Solution

by:mharfouch
mharfouch earned 250 total points
ID: 24310028
You should use an ID, not a class.

You just need to insert this where you want the button in the code:

<input type="submit" value="submit" id="button">

and this somewhere in the css:

#button {
      font-size:10px; background-color:#CCC;
}

And there you go. A little "normal" button.
0
 
LVL 1

Author Comment

by:dban00b
ID: 24315609
Neither of those look quite like the default button, but at least it gets me away from the hideous 'messed' up button they put on their entire site.
Thanks.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question