Dreamweaver: compatibilità explorer con css

Di: Donkey99 | 26/09/2020 18:47:07
Salve a tutti spero sia la sezione giusta se cosi non fosse chiedo scusa,
avrei una domanda da porvi
sto costruendo una pagina statica con dreamwaver cs5 con login username e password... l'unica cosa che non riesco a capire perchè il css su Explorer non si vede? mi spiego meglio alcune funzionalita' del tipo i caratteri, bottoni. Come posso far visualizzare questi oggetti anche su quel broswer?
su mozilla funzionano perfettamente e anche su safari ma volevo anche girasse bene su explorer in rete ho letto che esistono dei codici che riescono a far accettare gli standard degli altri browser anche su explorer che purtroppo non accetta, ma non so quanto siano attendibili ne ho provati alcuni senza alcun successo.
se qualcuno molto piu' esperto di me mi potesse aiutare mi farebbe un grande piacere.
posto anche il codice cosi capite meglio:
HTML
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script>
<!-- jquery validazioni //-->
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.js"></script>
<script type="text/javascript" src="validation_reg.js"></script>
<link rel="stylesheet" href="style.css" type="text/css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<style type="text/css">
body {
background-image: url();
}
#apDiv1 {
position:absolute;
left:1200px;
top:187px;
width:204px;
height:43px;
z-index:1;
}
</style>
</head>
<body>
<div id="apDiv1">
</div>
<div id="box">
<div class="top_left">
<div class="top_right">
<p>
<form action="pagina_di_registrazione.php" method="post" id="form_register">
<fieldset>
<label for="reg_user">Username*</label>
<input type="text" name="username" id="reg_user" />
<label for="reg_email">Email*</label>
<input type="text" name="email" id="reg_email" />
<label for="reg_pass1">Password*</label>
<input type="password" name="pass1" id="reg_pass1" />
<label for="reg_pass1">Conferma Password*</label>
<input type="password" name="pass2" id="reg_pass1" />
<input type="submit" name="register" value="registrati" id="reg_submit" />
</fieldset>
</form>
</p>
<form id="form1" name="form1" method="post" action="">
<div align="right">
<tr></tr>
</div>
</form>
</div>
</div>
<div class="bottom_left">
<div class="bottom_right"></div>
</div>
</div>
</body>

CSS
html,body{
margin: 0;
padding:0;
}
body{
font-family: Arial;
text-align: center;
}
#form_register{
text-align: left;
background-image: url('');
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 10px 10px 10px 10px;
width: 330px;
margin-left: auto;
margin-right: auto;
padding: 0 1.5em 1.5em 1.5em;
margin: 0 auto;
overflow: hidden;
}
#form_register fieldset{
border: none;
}
#form_register legend{
display: block;
font-size: 25px;
padding: 10px;
}
#form_register label{
padding: 0px;
display: block;
font-size: 0.6em;
margin: 20px 0px 0px 0px;
}
/*LABEL GENERATO DA VALIDATE*/
#form_register label.error{
color: #0f0e0e;
padding: 0;
margin: 10px 0px 0px 0px;
font-size: 1em;
padding-left: 18px;
background-image: url('error.png');
background-position: 0 0;
background-repeat: no-repeat;
}
/*imput text e password*/
#form_register #reg_user, #form_register #reg_email, #form_register #reg_pass1, #form_register #reg_pass2{
height: 30px;
width: 200px;
display: block;
border: none;
font-size: 16px;
line-height: 28px;
}
/*imput type submit e reset*/
#form_register #reg_submit, #form_register #reg_reset{
height: 30px;
width: 220px;
color: #fff;
font-weight: bold;
opacity: 0.7;
border: 2px solid #d9c272;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: 0 0 .5em rgba(0, 0, 0, .6);
-webkit-box-shadow: 0 0 .5em rgba(0, 0, 0, .6);
box-shadow: 0 0 .5em rgba(0, 0, 0, .6);
-webkit-appearance: none;
-moz-transition: opacity .5s;
-webkit-transition: opacity .5s;
-o-transition: opacity .5s;
transition: opacity .5s;
display: block;
}
#form_register #reg_submit{background: #171614; border radius: #d9c272; margin: 35px 40px 0px -5px;}
#form_register #reg_submit:hover,
#form_register #reg_submit:active,
#form_register #reg_reset:hover,
#form_register #reg_reset:active{
cursor: pointer;
opacity: 1;
}
@charset "utf-8";
/* CSS Document */
.top_left {background: url(box.gif) top left;padding-left:20px;}
.top_right {background: url(box.gif) top right;padding:20px;padding-left:0px;padding-bottom:1px;}
.bottom_left {background: url(box.gif) bottom left;padding-left:20px;}
.bottom_right {background: url(box.gif) bottom right;height:20px;}

Grazie Anticipatamente

Risposte



Ciao, ho inserito esattamente lo stesso script che hai postato e il problema si presenta anche su Firefox e Opera, ultime versioni... solo su Chrome si vedono i campi correttamente. Francamente a me sembra un tantino esagerato ingolfare la pagina con chilometriche regole di stile, per dare un effetto a quattro campi in un modulo di registrazione. Oltretutto gli utenti non esperti potrebbero non comprendere immediatamente che si tratta di campi, sotto le label. Io farei un modulo classico ben comprensibile.

Di: Gian Paolo | 26/09/2020 18:47:07