Forums

I got this great form from this site,
and it looks really great in Firefox,


But in Internet Explorer it shows up like this


I have tried to change the css in the chronoform theme folder for IE6 and IE7
but I cant get it right...

http://casaenecuador.ec/component/option,com_chronocontact/chronoformname,forma/lang,es/

 label3
{
width: 20em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block;
}

<fieldset>
<legend><strong>Sus Datos</strong></legend>
<br/><p><label3 for="name">Su nombre:</label3><input type="text" name="name" title="Ingrese su nombre aquí"size="20"></p>
<p><label3 for="surname">Su apellido:</label3><input type="text" name="apellido" title="Ingrese su apellido aquí" size="20"></p>
<p><label3 for="business">Empresa:</label3><input type="text" name="business"  size="20"></p>
 
<p><label3 for="email">Correo:</label3><input name="email" type="text" title="Ingrese su correo electrónico correctamente"size="20">
<p><label3 for="dayphone">Teléfono:</label3><input type="text" name="day_phone" size="20">         </p>
<p><label3 for="cell">Celular:</label3><input type="text" name="cell_phone" size="20"></p>
<p><label3 for="civil">Estado Civil:</label3><input type="text" name="estado_civil" size="20"></p>
<p><label3 for="sueldo">Sueldo mensual (USD):</label3><input type="text" name="sueldo" size="20"></p>
<p><label3 for="inicial">Entrada Inicial (USD):</label3><input type="text" name="entrada" size="20"></p>
<p><label3 for="cuota">Valor de la cuota que estima pagar (USD):</label3><input type="text" name="cuota" size="20"></p>
<p><label3 for="antiguedad">Antiguedad laboral:</label3><input type="text" name="antiguedad" size="20"></p>
 
 
<br/>
<label3 for="propiedad"><strong>Posee alguna propiedad o vehículo</label3></strong>
<select NAME="propiedad" id="ff_elem203" size="1">
  <option SELECTED VALUE="none">-</option>
  <option VALUE="Si">Si</option>
  <option VALUE="No">No</option>
</select></p>
 
<br/>
<label3 for="afilliado"><strong>Está usted afiliado al IESS?</label3></strong>
<select NAME="afilliado" id="ff_elem203" size="1">
  <option SELECTED VALUE="none">-</option>
  <option VALUE="Si">Si</option>
  <option VALUE="No">No</option>
</select></p>
 
<br/>
<label3 for="conyugue"><strong>Está su conyugue afiliado(a) al IESS?</label3></strong>
<select NAME="conyugue" id="ff_elem203" size="1">
  <option SELECTED VALUE="none">-</option>
  <option VALUE="Si">Si</option>
  <option VALUE="No">No</option>
</select></p>
</p>
</fieldset>

Any ideas how I can make it look the same in Explorer?

Thanks a lot!

Hi sweet160,

ChronoForms loads a separate css file for IE - are you editing that as well?

Bob

Thank you for your answer.

I know about the two separate files for ie6 ie7. And I tried to change them but I didn't manage to make it look similar.
I copied the css from the general file into the ie css files.
But it loooks bad like in the screenshots.

Seems like ie doesn't Likes the indents.

Is there a workaround for this?

Thanks!

Hi sweet160,

I suggest that you undo the changes that you have made. The default ChronoForms styling works in FF & IE and looks pretty much like what you need.

Bob

Hi Greyhead!

thanks for looking into this...

Did you mean that I should undo the changes (and use the original css files) I made in the
component/chrono../themes/default/css/style1-ie6.css
component/chrono../themes/default/css/style1-ie7.css ....

files and only edit the

component/chrono../themes/default/css/style1.css file?

also I found that in the administrator part of the site these files exist as well.. should they always be untouched?

Thanks for your help!

Hi sweet160,

It looks as though you are making things worse at present, that's usually a sign to go back. The default styling appears to be close to what you want - apart from the alignment of the labels?

The files do exist in two places (I'm not sure why) the admin ones are used in the Wizards but not on the live form.

Bob

Hi,

Yes that exactly the problem... the alignment of the labels in Internet Explorer...

is there an alternate way to get them aligned?

Hi sweet160,

I image that you'd use style='text_align:right;'

Bob

I had to put the inputs in another table cell
to get them aligned in IE

thanks Greyhead