Jump to content

Recommended Posts

I am trying to use CSS rules to only input[type=text] but IE seems to be has different thoughts , any solution other than assigning a class to each text box ?

 

Thanks

 

You need to be clearer and more specific - perhaps show an example of your html markup and the css. I assume you mean a form text box. If so, rather than applying a class to each box, you apply text styles to the form element within the css itself, like so:

form {
font-family:verdana, sans-serif;
font-size:.95em;
color:#666666;
}

 

CSS is NOT recommended for styling the actual form controls (not cross-browser and cross-platform friendly), but certainly fine for overall text, widths, margins, paddings, borders.

 

Here is an article about why the form controls are screwy, but you can pick up tips on styling parts of form elements with css.

 

http://www.456bereastreet.com/archive/200409/styling_form_controls/

Ah. So, you are asking if there is a css command specifically to modify the actual input[type=text] TAG itself (as there is for other tag level elements like p, ul, form, table, td, tr, etc.)? ...

 

... no.

 

There was a reason IE had different thoughts. And so would Opera in SuSe 10.1, Safari in OS X 10.4, FF in OX 10.4 or Win XP or SuSe 10.1, IE 6.0 or 7.0 winXP.

 

As I said in MY post, assigning a css style to the actual single or multiple line text input control "widget" itself (or any other browser-skin controlled web element, like scroll-bars) is NOT cross-browser OR cross-platform compatible. It is an exercise in futility and will make your form look ridiculous except in the browser/platform you specifically tested (and therefore designed) it in.

 

Here is an actual example of css styling for a single line text input with screenshots of the same css/html in 14 different browser/platforms:

 

http://www.456bereastreet.com/lab/styling-form-controls-revisited/text-input-single/

ok, here is a good solution if someone facing my problem

<!--[if lte IE 7]>
<link href="../CSS/mystyle.css" rel="stylesheet" type="text/css" media="screen" />
<![endif]-->

 

this line will check the browser if it is lower than or equal IE7 if so I made a special CSS version for all the <Input> tags, also the comment code will trick any other browser (other than genius IE) so it wont get called.

 

this solution found in projectseven.com , I do need now to modify all pages  8)

yes, and i have to modify all my 25 pages just to appear cool in IE  >:(

 

next project you'll remember to PLAN in advance and have a list of golas to hit - like cross browser compatability....

 

ALL 25? hardly a lot of pages really - plus if you use something like dream weaver you can do a site wide regex replace!

Ah, yes ... IE Conditional Comment.

 

I don't go anywhere without my good old IE conditional comment!

 

TM, I use DW 8 (for speed editing of tags) and my main site has over 60,000 files including 2500 html and 200 php  pages ... doing a site-wide replace just crashes XP like a Mini-Van housewife on a cellphone.

wow what kind of site is that ???

 

Major NYC Real Estate Apartment rental/sales firm.

 

I've recently been permitted to convert the old quirks crap, that I made 5 years ago :(, to valid css. It has taken me nearly one year to convert half the site and I am now in the process of converting the other half.

 

At least, once finished, changing how the site looks in future will be easy by just changing the css.

 

This week alone I recoded 150 static html pages to a new layout (but not live yet) and I have another 200 or so to go until all static pages are done.  Then I have to go to work on the php pages ... AGGGGGHHH! All those echos of <trs>, <tds> and hundreds of <font="....>!!!!

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.