ciao! ultimamente sto migliorando la grafica del mio sito e nel farlo mi sono imbatutto in un errore che pare al quanto strano..
codice:
input.userbar {
  background: #BBBBBB;
  border: 1px solid #A6A6A6;
  width: 400px;
  float: right;
  margin-right: 195px;
  margin-bottom: 5px;
  height: 20px;
  outline:0;
  padding-left: 7px;
  padding-right: 7px;
  -moz-border-radius: 7px; 
  -webkit-border-radius: 7px; 
  border-radius: 7px; 
  -webkit-transition: 500ms all ease;
  -moz-transition: 500ms all ease;
  -o-transition: 500ms all ease;
  -ms-transition: 500ms all ease;
  transition: 500ms all ease; 
  
}
input.userbar:focus {
  background: #FFFFFF;
  border-color: #7bc1f7;
  -moz-box-shadow: 0px 0px 8px #7bc1f7; 
  -webkit-box-shadow: 0px 0px 8px #7bc1f7; 
  box-shadow: 0px 0px 8px #7bc1f7; 
}
e il relativo html
codice:
                <p>Contatti:</p><br />
                
                <p><label>Sito Web:</label>&nbsp;<input value="<?php echo $sito; ?>" type="text" class="userbar" name="sitoweb" /></p>
                               
                <p><label>Skype:</label>&nbsp;<input value="<?php echo $skype; ?>" type="text" class="userbar" name="skype" /></p>
                
                <p><label>Facebook:</label>&nbsp;<input value="<?php echo $facebook; ?>" type="text" class="userbar" name="facebook" /></p>
                
                <p><label>Twitter:</label>&nbsp;<input value="<?php echo $twitter; ?>" type="text" class="userbar" name="twitter" /></p>
                <?php if(!empty($code)) { echo $code; } ?>
                <div id="contplus">
                <!-- <input type="button" onclick="addcontact();" value="+" /> -->
                <div class="contplus" onclick="addcontact();"></div><br />
                </div>
                <hr width="40%" style="margin: 5px auto; position: relative;" color="#009BFF" size="1" />
il problema è questo: se inserisco le "transition" nel css, il tag hr non si mostra sempre al centro come richiesto nell'attributo "style", a volte si trova spostato tutto a sinistra e altre volte spostato giusto al centro.. se invece tolgo le transition, cada il mondo che lo trovo sempre al centro.. tra l'altro non capisco perché quando è la volta che la linea(hr) non si trova al centro, le input text si caricano nella pagina con una transizione da destra verso sinistra(che è pure carina come transizione ma non è voluta da me).
Qualcuno potrebbe spiegarmi la causa?
PS: un'altra cosa: non capisco perché la seconda inputtext che c'è nella parte "contatti" non si visualizza bene(in senso che è spostata più in basso del dovuto).
PPS: Il sito per vedere il tutto sarebbe questo: http://youtoobob.it/cp.php ma bisogna essere registrati per accedervi e immagino che ovviamente non abbiate voglia ^^ quindi vi lascio un paio di screen:
http://i.imgur.com/7Jgol4D.png //linea spostata al centro nel modo giusto
http://i.imgur.com/f6cbOGp.png //linea spostata nel modo sbagliata