Diff CSS styles for diff INPUT TYPE='s?

Diff CSS styles for diff INPUT TYPE='s?

Post by A Travele » Thu, 02 Sep 2004 04:04:15


I know in a css file, i can declare a style which will apply to a given HTML
tag, specifically, i am looking at an INPUT tag. Is there any way in which i
can create a style section which will apply to a specific *type* of input??
That is, a section which applies only to [input type=text] or only to [input
type=check] or whichever?

Thanks in advance.
 
 
 

Diff CSS styles for diff INPUT TYPE='s?

Post by Hermit Dav » Thu, 02 Sep 2004 04:09:44

if you are using asp.net (assuming a. you have a cross posted and b posted
in asp.net yet... ie yes)
you use something called webcontrols. you can assign different styles to
different webcontrols.. yes even if they are of the same type like a textbox
control (which is rendered as input type = text

--

Regards,

Hermit Dave
( http://www.yqcomputer.com/ )


HTML
i
input??
[input

 
 
 

Diff CSS styles for diff INPUT TYPE='s?

Post by Thomas Dod » Thu, 02 Sep 2004 04:17:01

use CSS classes then use each unique class with each *type* of input ...
 
 
 

Diff CSS styles for diff INPUT TYPE='s?

Post by A Travele » Thu, 02 Sep 2004 04:24:55

This doesnt actually work. Here is what i have, in my CSS, there is an INPUT
{} section, then i also have a .noborder{} section. in the input, i declare
a certain type, so all my textboxes look the same. I then use the .noborder
class on my checkboxes, because the check boxes look a little dorky with the
extra border painted around them. Only thing is, the checkboxes STILL wind
up with the border as defined in input, even though they are overriden with
a specific class.

The textboxes and chkbxs are all [asp:textbox or [asp:checkbox. The reason
is, the CssClass property on the checkbox does not actually apply to the
ACTUAL checkbox. It applies rather to the combined control which ASP.NET
renders for a checkbox of a Checkbox and either a Literal control or a Label
(im not sure if its the Lit or Lbl).
 
 
 

Diff CSS styles for diff INPUT TYPE='s?

Post by Hermit Dav » Thu, 02 Sep 2004 04:34:43

see it in action different controls having different stylesheets applied to
different controls
infact even the same type of controls

www.steptall.com

check the links near the shopping bag area. you can dig deeper if you wish.

--

Regards,

Hermit Dave
( http://www.yqcomputer.com/ )


INPUT
declare
.noborder
the
with
Label


posted
 
 
 

Diff CSS styles for diff INPUT TYPE='s?

Post by PJ » Thu, 02 Sep 2004 05:27:10

this is a css problem...it would be helpful if you actually included the
appropriate section of the stylesheet as well as the markup.

if you have a style defined for input like:

input {
border: 1px solid green;
background: #efefef;
}

this style will apply to all <input> elements. if you need to ovverride it
for a specific set of elements, use a class as you've done.

<input type="checkbox" class="check" />

.check {
border: none;
}

Note, the checkbox will have a background of #efefef because both styles
apply to the checkbox. However, the checkbox will not have a border,
because the class style specifically defines a border of "none."



INPUT
declare
.noborder
the
with
Label


posted
 
 
 

Diff CSS styles for diff INPUT TYPE='s?

Post by Steve Fult » Thu, 02 Sep 2004 06:17:34


input[type=text] { /* your styles here */ }

5.8 Attribute selectors
<URL: http://www.yqcomputer.com/ #attribute-selectors>

Unfortunately, this won't work in IE, even though the CSS2 spec is over
six years old! You can use it so that clients that implement the spec
will use your styles, but IE won't; or you can needlessly clutter your
HTML with code like:

<input type="text" class="text" ...>

and use a selector like

input.text { ... }

--
Steve

Liberty means responsibility. That is why most men dread it.
-George Bernard Shaw