Ajuda para centralizar uma calculadora de moedas em HTML

  • Autor Autor cochochenko
  • Data de início Data de início
Tradução em andamento: em alguns minutos este tópico estará em português. Por enquanto, o conteúdo está no original em espanhol. Ver original
C

cochochenko

Gamma
Domainer
Hola Betas me podrán decir cuál es mi error, estoy tratando de hacer una calculadora de divisas que quede en todo el medio de la web ya que lo intrucire en una webview pero siempre me queda a un lado como pueden ver aquí quiz.yoiebu.com quisiera que la forma estuviera centrada pero no logro hacerlo, donde está el error. Aquí el código
Inserir CODE, HTML ou PHP:
<?php
# valor de conversión
if(isset($_POST["conversion"]) && (is_numeric($_POST["conversion"]) || is_numeric(str_replace(",",".",$_POST["conversion"]))))
{
    $conversion=str_replace(",",".",$_POST["conversion"]);
}else{
    $conversion=813558.89;
}
 
# valor a convertir
if(isset($_POST["aconvertir"]) && (is_numeric($_POST["aconvertir"]) || is_numeric(str_replace(",",".",$_POST["aconvertir"]))))
{
    $aconvertir=str_replace(",",".",$_POST["aconvertir"]);
}else{
    $aconvertir=0;
}
 
# calculo
$resultado=$conversion*$aconvertir;
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Type" content="text/html; charset=gb18030">
    
    <title>Cambio Bol��vares a Real</title>
 
    <style>
    centrado-porcentual {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}
   
        form span {
           
            display:block;
            float:left;
            width:160px;
        }
        input {text-align:right;}
        
	 
      
    </style>
</head>
 
<body>
<div class="centrado-porcentual">
    <h1>Real en Bolívares Fuertes</h1>
    <form action="<?php echo $_SERVER["PHP_SELF"]?>" method="post">
 
        <span>Valor del Real</span>
            <input type="text" name="conversion" value="<?php echo $conversion?>">
 
        <br><span>Real R$</span>
            <input type="text" name="aconvertir" value="<?php echo $aconvertir?>">
 
        <br><span>Bolivares</span>
            <input type="text" name="resultado" readonly value="<?php echo number_format($resultado,2,".",",")?>">
 
        <p><input type="submit" value="Calcular"></p>
    </form>
    </div>

</body>
</html>
 
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Leva 30 segundos · você volta a este tópico ao terminar
con

.centrado-porcentual {
display: grid;
justify-content: center;
align-items: center;
}

con esto se centra xddd, hay mejores lo se
 
Última edição:
Añadile un text-align con valor center a el class .centrado-porcentual Se que el text-align es para texto, pero a mi me centró divs sin problema.

Otra opción es también que añadas un text-align con valor center directo al body, y si deseas algún elemento en otra posición con un class le pongas otra alineación.

Si vez que ignora el atributo, añadile un atributo position con valor absolute, para que se super ponga a cualquier otro atributo.
 
Añadile un text-align con valor center a el class .centrado-porcentual Se que el text-align es para texto, pero a mi me centró divs sin problema.

Otra opción es también que añadas un text-align con valor center directo al body, y si deseas algún elemento en otra posición con un class le pongas otra alineación.

Si vez que ignora el atributo, añadile un atributo position con valor absolute, para que se super ponga a cualquier otro atributo.

Ya resolví con un código jquery.... Graciasss
 
Ok, pero en el ejemplo sigue a la izquierda.
 

Tópicos similares

Voltar
Topo