.formulaire { display: flex; justify-content: center; align-items: center; height: 100vh; } .cadre { position: relative; padding: 50px 50px; background: #fff; border-radius: 10px; background:purple; } .cadre h1 { letter-spacing: 5px; margin-bottom: 60px; font-weight: bold; padding-left: 10px; } .cadre .inputbox { position: relative; width: 300px; height: 50px; margin-bottom: 25px; } .cadre .inputbox input { width: 100%; border: 2px solid #000; outline: none; background: none; padding: 10px; border-radius: 10px; font-size: 1.2em; } .cadre .inputbox span { position: absolute; top: 14px; left: 20px; font-size: 1em; transition: 0.3s; font-family: sans-serif; } .span_date{ margin-left: 7px; font-size: 1em; font-family: sans-serif; } .cadre .inputbox input:focus ~ span, .cadre .inputbox input:valid ~ span { transform: translateX(-13px) translateY(-35px); font-size: 1em; } input[type="submit"], #buttonTEL{ border: none; border-radius: 5px; border: 2px solid #000; margin: 10px 0px 0px 25%; padding: 20px 10% 20px 10%; }