CSS Help
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me
Go Back   Dev Shed Forums > Web Design > CSS Help
Reload this Page

CSS: 2 Input Styles

Discuss CSS: 2 Input Styles in the CSS Help forum on Dev Shed.
CSS: 2 Input Styles Cascading Style Sheets (CSS) forum discussing all levels of CSS, including CSS1, CSS2 and CSS Positioning. CSS provides a robust way of applying standardized design concepts to your web pages.

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old November 14th, 2002, 07:46 PM
Optimum Optimum is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Aug 2002
Posts: 415 Optimum User rank is Private First Class (20 - 50 Reputation Level)Optimum User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: 4 h 27 m 12 sec
Reputation Power: 6
Send a message via AIM to Optimum
CSS: 2 Input Styles
input{font-family: Arial; font-size: 14px; color: #000000; margin: 1px; padding: 2px; border: 1 solid #CCCCCC}

I want that for the submit buttons and radio buttons, and checkboxes and stuff. But I want

input{font-family: Arial; font-size: 14px; color: #000000; margin: 1px; padding: 2px; border: 1 dashed #CCCCCC}

for the textboxes... how do I do two?
Reply With Quote
  #2  
Old November 14th, 2002, 07:54 PM
adios adios is offline
Senior Citizen
Dev Shed Regular (2000 - 2499 posts)
  
Join Date: Jan 2001
Location: leftcoast
Posts: 2,019 adios User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 10
Read "The class Attribute" here.
Reply With Quote
  #3  
Old November 15th, 2002, 08:28 AM
Tuxie Tuxie is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Apr 2002
Location: Inside the GNU/Hurd kernel
Posts: 492 Tuxie User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 1 m
Reputation Power: 7
It's very simple:
input[type="checkbox"]{font-family: Arial; font-size: 14px; color: #000000; margin: 1px; padding: 2px; border: 1 solid #CCCCCC}

input[type="submit"]{font-family: Arial; font-size: 14px; color: #000000; margin: 1px; padding: 2px; border: 1 solid #CCCCCC}

input[type="text"]{font-family: Arial; font-size: 14px; color: #000000; margin: 1px; padding: 2px; border: 1 dashed #CCCCCC}
Reply With Quote
  #4  
Old November 15th, 2002, 11:00 AM
degsy degsy is offline
Contributing User
Dev Shed Intermediate (1500 - 1999 posts)
  
Join Date: Nov 2001
Posts: 1,882 degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level) 
Time spent in forums: 5 Days 21 h 19 m 30 sec
Reputation Power: 13
Are you sure Tuxie

Doesn't seem to work with IE6, Moz1.0 or NS7
It would be best to use classes anyway because most, probably all, browsers will support them.
Reply With Quote
  #5  
Old November 15th, 2002, 12:08 PM
MJEggertson MJEggertson is offline
Contributing User
Dev Shed Novice (500 - 999 posts)
  
Join Date: Jan 2002
Location: Seattle WA
Posts: 863 MJEggertson User rank is Corporal (100 - 500 Reputation Level)MJEggertson User rank is Corporal (100 - 500 Reputation Level)MJEggertson User rank is Corporal (100 - 500 Reputation Level)MJEggertson User rank is Corporal (100 - 500 Reputation Level) 
Time spent in forums: 22 sec
Reputation Power: 8
It's important to note that Tuxie's example is proper, just that support for it still isn't exactly widespread. So for the mean time, it's a poor solution.
Reply With Quote
  #6  
Old November 15th, 2002, 06:46 PM
jkd jkd is offline
CF sMod
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Jul 2000
Location: Maine, USA (a.k.a. Boonies)
Posts: 242 jkd User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 6 m 43 sec
Reputation Power: 9
Send a message via ICQ to jkd Send a message via AIM to jkd Send a message via Yahoo to jkd
Tuxie's example works fine the in the following web browers:

Mozilla (Netscape 6+ and other similar browsers)
IE5/Mac
Opera 5+ (Maybe 6+)
and Konqueror (don't know version numbers)
__________________
Jason Contact Me
Super moderator @ CodingForums
Reply With Quote
  #7  
Old November 15th, 2002, 07:56 PM
degsy degsy is offline
Contributing User
Dev Shed Intermediate (1500 - 1999 posts)
  
Join Date: Nov 2001
Posts: 1,882 degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level) 
Time spent in forums: 5 Days 21 h 19 m 30 sec
Reputation Power: 13
I tested Tuxies example in NS6.1, NS7 (Beta), Moz1.0 and it had no effect.
Reply With Quote
  #8  
Old November 16th, 2002, 10:38 AM
Tuxie Tuxie is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Apr 2002
Location: Inside the GNU/Hurd kernel
Posts: 492 Tuxie User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 1 m
Reputation Power: 7
Like jkd and MJEggertson said,there's nothing wrong with my code,replace it with something like background-color:red and you will clearly see the input elements become red.
Also,all browsers,except for IE ofcourse,support this.
Reply With Quote
  #9  
Old November 16th, 2002, 10:48 AM
degsy degsy is offline
Contributing User
Dev Shed Intermediate (1500 - 1999 posts)
  
Join Date: Nov 2001
Posts: 1,882 degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level)degsy User rank is Sergeant (500 - 2000 Reputation Level) 
Time spent in forums: 5 Days 21 h 19 m 30 sec
Reputation Power: 13
Quote:
Also,all browsers,except for IE ofcourse,support this.


Dosen't work in NS4.7 or Opera6 (identified as Opera or Moz5).
Reply With Quote
  #10  
Old November 16th, 2002, 11:27 AM
Optimum Optimum is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Aug 2002
Posts: 415 Optimum User rank is Private First Class (20 - 50 Reputation Level)Optimum User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: 4 h 27 m 12 sec
Reputation Power: 6
Send a message via AIM to Optimum
.radio{font-size: 14px; margin: 1px; padding: 1px; border: 0}
.checkbox{font-size: 14px; margin: 1px; padding: 1px; border: 0}
.text{font-family: Arial; font-size: 14px; color: #000000; margin: 1px; padding: 2px; border: 1 dashed #CCCCCC}

But when I do the classes for each input thingy.. like for the textbox lets say. I would put class="text", and it doesn't work... why the hell not? LOL
Reply With Quote
  #11  
Old November 16th, 2002, 12:53 PM
Tuxie Tuxie is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Apr 2002
Location: Inside the GNU/Hurd kernel
Posts: 492 Tuxie User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 1 m
Reputation Power: 7
Quote:
Originally posted by degsy
Dosen't work in NS4.7 or Opera6 (identified as Opera or Moz5).


NS4 doesn't support the W3C standards very well Besides,we are talking about modern browsers,not browsers that are 4 years old.Or would you like to check if it works in Internet Explorer 2?
Opera has some quirks in the [attribute=value] thing,because only some attributes work.
Reply With Quote
  #12  
Old November 16th, 2002, 12:54 PM
Optimum Optimum is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Aug 2002
Posts: 415 Optimum User rank is Private First Class (20 - 50 Reputation Level)Optimum User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: 4 h 27 m 12 sec
Reputation Power: 6
Send a message via AIM to Optimum
lol, but do you guys know my problem?
Reply With Quote
  #13  
Old November 16th, 2002, 01:01 PM
Optimum Optimum is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Aug 2002
Posts: 415 Optimum User rank is Private First Class (20 - 50 Reputation Level)Optimum User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: 4 h 27 m 12 sec
Reputation Power: 6
Send a message via AIM to Optimum
oh.... so then, thats the image soruce.. nvm, thanks for the code!
Reply With Quote
Reply

Viewing: Dev Shed Forums > Web Design > CSS Help > CSS: 2 Input Styles

« Previous Thread | Next Thread »

Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Linear Mode Linear Mode
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump


Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support |