HTML Form styling IE6 issues!

I've got a simple form on a webpage (that doesn't actually submit any info), anyway in terms of layout it is as follows:

input output output input output output input output output total total total

Each of the output and total fields have their own class (.disabledbox) and I have styled this as follows(CSS). They are all "disabled" form boxes:

.disabledbox {    
border:none;
text-align:center;
background-color:#ccc;
color:#000000;
}

Here's the HTML for said form:

<input name="text" id="text1"  disabled="disabled" class="disabledbox" value="£ 0"/>
    <input name="text" id="text2" disabled="disabled" class="disabledbox" value="£ 0"/>

My problem is that on the output fields I want the colour of the output to be black, this works fine in FF and Chrome but my problem is that I need to also support my nemesis IE6 (as that's what the majority of users here have) but for some reason in IE6 it just will not accept the style. Am I doing something wrong?

Answers


The "disabled" style of the input is "hardcoded" in IE6 and can not be overridden. I'd suggest not to use disabled inputs here. You have two alternatives:

  1. Use readonly instead: <input name="text" id="text1" readonly="readonly" class="disabledbox" value="£ 0"/>

  2. Don't use inputs. You can just use a <div> or <span> and set its innerHTML instead. You can style the <span> or <div> anyway you like.


You can achieve that with readonly="readonly"

<input name="text" id="text1"  readonly="readonly" class="disabledbox" value="£ 0"/>

That's not completely disabling the input, but it will prevent editing.


Try to use the css only for ie6?

<!--[if IE 6]>
  <link rel="stylesheet" type="text/css" href="ie-6.0.css" />
<![endif]-->

in this Css use _color: #youcolor;


Need Your Help

Java Swing stack components vertically without spreading out

java swing layout alignment jpanel

I've been trying for ages to get a list of JPanels to stack vertically without spreading out to all available vertical space.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.