es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo centro la entrada en un div?

18 Jul, 2023 Programación 
<div id="siteInfo">
   <input value="Some Button">
</div>

siteInfo {
   padding: 5%;
   background: rgba(0,0,0,0.6);
   text-align : center;
   position: absolute;
   left: 50%;
   top: 50%;
   transform: translate(-50%,-50%);
}
input {
   margin: 0 auto;
   padding: 5%;
   width: 300px;
   display: inline-block;
}
Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para centrar la entrada en el div, puedes usar las propiedades CSS text-align: center en el div y display: block; margin: 0 auto; en la entrada. Esto centrará el texto dentro del div y el cuadro de entrada dentro de su contenedor.
    Aquí está el código HTML y CSS actualizado:

    HTML:

    <div id="siteInfo">
   <input value="Algun Botón">
</div>

    CSS:

    #siteInfo {
  padding: 5%;
  background: rgba(0,0,0,0.6);
  text-align: center;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}
input {
  display: block;
  margin: 0 auto;
  padding: 5%;
  width: 300px;
}

Comments are closed.