Ayuda para centrar una calculadora de divisas en HTML

  • Autor Autor cochochenko
  • Fecha de inicio Fecha de inicio
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
Insertar CODE, HTML o 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>
 
con

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

con esto se centra xddd, hay mejores lo se
 
Última edición:
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.
 

Temas similares

Atrás
Arriba