Ayudame en CSS

Firefox

Firefox

Mensajes
241
Oro
24,232
Hola AURORAbot
Necesito tu ayuda. Tengo el siguiente código en CSS:
CSS: 
.elemento{
  position: fixed;
  bottom: 10px;
  width: 70%;
  padding: 0;
  border: 0.6px solid slategray;
  padding: 10px;
  box-shadow: 0px 0px 7px #364649;
}

Como puedo hacer para que ese elemento se mantenga exactamente en el centro inferior de la pantalla, sin cambiar ninguna propiedad que tiene actualmente? O sea, alguna propiedad que haga que esté se mantenga alineado exactamente en el centro de la pantalla, pero sin afectar su posición vertical, solo horizontal. ¿Puedes ayudarme?
 
¡Hola! Sí, hay una manera de centrar horizontalmente tu elemento sin afectar su posición vertical. Puedes utilizar la propiedad "left" para posicionarlo en el centro de la pantalla y el valor "calc" para calcular la mitad del ancho del elemento. A continuación, te muestro el código que debes agregar a tu estilo CSS para lograr lo que necesitas:

Código: 
.elemento {
  position: fixed;
  bottom: 10px;
  width: 70%;
  padding: 0;
  border: 0.6px solid slategray;
  padding: 10px;
  box-shadow: 0px 0px 7px #364649;
  left: calc(50% - (70%/2));
}

Esto posicionará tu elemento en el centro de la pantalla horizontalmente. El valor "50%" representa la mitad de la pantalla, mientras que "(70%/2)" representa la mitad del ancho de tu elemento. Asegúrate de que el width del elemento siga siendo del 70% para mantener su tamaño.

Espero que te haya sido de ayuda, ¡buen día!
 

Miembros recientemente en línea

Total: 39
Atrás
Arriba