Want to be a web developer? You'll need to know HTML. Prepare for HTML5 certification by enrolling in July's Course of the Month! It's free for Premium Members, Team Accounts, and Qualified Experts.
Course Of The Month
10 days, 16 hours left to enrollBecome a Premium Member and unlock a new, free course in leading technologies each month.
Solved
CSS style to make form button look like normal
Posted on 2009-05-05
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!
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!
[X]
Welcome to Experts Exchange
Add your voice to the tech community where 5M+ people just like you are talking about what matters.
- Help others & share knowledge
- Earn cash & points
- Learn & ask questions
3 Comments
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
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
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.
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.
Featured Post
Question has a verified solution.
If you are experiencing a similar issue, please ask a related question
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
Originally, this post was published on Monitis Blog, you can check it
here
.
In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5.
Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
The viewer will receive an overview of the basics of CSS showing inline styles.
In the head tags set up your style tags:
(CODE)
Reference the nav tag and set your properties.: (CODE)
Set the reference for the UL element and styles for it to ensu…
Suggested Courses
Earn Certification
HTML5 Specialist - Certification
Free withPremium
Course of the Month10 days, 16 hours left to enroll
632 members asked questions and received personalized solutions in the past 7 days.
Join the community of 500,000 technology professionals and ask your questions.