Solved

How do I create a global CSS statement for all input fields on all my .aspx pages

Posted on 2010-09-17
5
329 Views
Last Modified: 2012-05-10
Is there a way to define a global style that will cover all the input elements throughout my site? I don't want to have to assign the style to each element (ie cssClass=).

Something like: BODY {font-family: serif; background-color: silver;}  only to cover asp:textbox, asp:dropdownlist, etc.

tried INPUT.TEXT{ }.... this doesn't work

Thanks
0
Comment
Question by:Bob Hoffman
5 Comments
 
LVL 9

Expert Comment

by:TonyReba
ID: 33705905
if you dont want to use a class,

input[type=button], input[type=submit]
{
width:auto;
padding:3px 6px;
color:#ffffff;
text-align:center;
background:#e2212a;
font-size:11px;
font-weight:bold;
border:0px;
margin:2px;
cursor:pointer;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;

}

Open in new window

0
 
LVL 41

Expert Comment

by:guru_sami
ID: 33705909
0
 
LVL 9

Accepted Solution

by:
TonyReba earned 500 total points
ID: 33705920
this goes in your head secition
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>-z-</title>
<style type="text/css">
input, textarea {
border: 2px solid #d69;
background: #999;
float: left;
clear: left;
width: 250px;
margin: 10px 0;
padding: 6px;
font: 1.2em monospace;
color: #fc3;
letter-spacing: .07em;
}
</style>
</head>

Open in new window

0
 
LVL 1

Expert Comment

by:Hafeez Ansari
ID: 33708630
You can do it in 2 different ways, first method is to write css codes direct for input elements e.g.

input[type=text]
{
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
padding:4px;
font:12px;
}
in the above mentioned codes you are writing codes to apply directly on input type. and wherever you'll use in html <input type="text"............. /> these codes will automatically apply to all inputs.
But you can do the same thing in another way, first write a style class and then apply to the concerning elements e.g.
.textEntry
{
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
padding:4px;
font:12px;
}
now you have a class named 'textEntry' in your css and you can apply this class to the elements for example:
<input class="textEntry" type="text size="25" value="" />

hope this will be helpful to you.
0
 
LVL 8

Author Closing Comment

by:Bob Hoffman
ID: 33711550
This did the trick... added "select" to handle the dropdown lists.

input, textarea, select {}

Thanks everyone.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Suggested Solutions

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…

867 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

Need Help in Real-Time?

Connect with top rated Experts

22 Experts available now in Live!

Get 1:1 Help Now