Quiero que un div se me coloque en el margen superior derecha de la página pero que no descuadre el otro div que debe estar centrado en TODA la página. Es decir, un div para "saludar al usuario" arriba a la derecha, y un div "reservar" en el centro de la página.
Cuando incluyo el div de "saludar al usuario", se descoloca el de "reservar".
¿Qué ocurre? Código CSS:
* {
margin: 0;
padding: 0;
font-family: sans-serif;
box-sizing: border-box;
}
body {
/*background: #DEDEDE;*/
display: flex; /*Centrado en la página tanto vertical como horizontal.*/
min-height: 100vh;
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed; /*Imagen de fondo no se vaya con el scroll de la página.*/
-o-background-size: 100% 100%, auto;
-moz-background-size: 100% 100%, auto;
-webkit-background-size: 100% 100%, auto;
background-size: 100% 100%, auto;
}
.sesion_cliente{
margin: auto;
padding: 5px;
background: #F3F3F3;
text-align: right;
border: 1px solid rgba(0,0,0,0.2);
}
.busqueda{
margin: auto;
width: 50%;
max-width: 500px;
background: #F3F3F3;
padding: 18px;
border: 2px solid rgba(0,0,0,0.2);
}
h2{
text-align: center;
margin-bottom: 20px;
color: rgba(0,0,0,0.5);
}
input{
display: block;
padding: 10px;
width: 100%;
margin: 30px 0;
font-size: 14px;
}
input[type="submit"] {
background: linear-gradient(#FFDA63, #FFB940);
border: 0;
width: 160px;
color: brown;
opacity: 0.8;
cursor: pointer;
border-radius: 20px;
margin-bottom: 0;
}
.form-link{
font-size: 12px;
}
Código PHP:
<?php
//Iniciar una nueva sesión o reanudar la existente.
session_start();
//Si existe la sesión "cliente"..., la guardamos en una variable.
if (isset($_SESSION['cliente'])){
$cliente = $_SESSION['cliente'];
}
?>
<!DOCTYPE html>
<html lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Reservar</title>
<link rel="stylesheet" href="css/estilos_reservar.css">
</head>
<body background="imagenes/fondo_campo1.jpg">
<div class="sesion_cliente">
<?php
//Si existe la sesión "cliente"...
if(isset($_SESSION['cliente'])){
echo "Bienvenido ".$cliente." ";
echo "<a href='reservar.php?salir=1'>Salir</a>";
//Si existe y hemos pulsado el link "Salir"...
if(isset($_REQUEST["salir"])){
//Borramos o destruimos la sesión "cliente".
unset($_SESSION["cliente"]);
//Redireccionamos a la página "iniciar_sesion_cliente.php" en 0 segundos.
header("Refresh:0; url=iniciar_sesion_cliente.php");
}
}
?>
</div>
<div class="busqueda">
<form action="<?php echo $_SERVER['PHP_SELF'];?>" name="mibusqueda" id="mibusqueda" method="POST" class="form_buscar">
<h2>RESERVAR</h2>
<label for="check_in"><b>Entrada:</b></label>
<input type="text" placeholder="Fecha de entrada" name="check_in" id="check_in" value="<?php if(isset($_POST['check_in'])){ echo $_POST['check_in']; }?>">
<label for="check_out"><b>Salida:</b></label>
<input type="text" placeholder="Fecha de salida" name="check_out" id="check_out" onchange="calculoNoches();" value="<?php if(isset($_POST['check_out'])){ echo $_POST['check_out']; }?>" disabled>
<div align="center">
<input type="submit" value="Buscar" name="buscar" id="buscar"><br/>
</div>
</form>
</div>
</body>
</html>