Tamaño del cuerpo / ¿Qué código se requiere?

Hola a todos.
Añadí radio de borde a este código e hice la parte inferior como quería.
Pero no puedo arreglar la parte superior.

¿Qué códigos debería añadir para que la parte superior se vea igual que la inferior?

como: tamaño-altura-superior: -30%; pero esto no funciona

body:before {
  display: inline-block;
  border-radius: 15px;
  width: 1125px;
  min-height: 100%;
  height: inherit;
  background-color: #fff;
  content: " ";
  position: fixed;
  left: 50%;
  right: 0;
  transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}

Lo siento, pero no parece estar claro lo que necesitas hacer. ¿Podrías añadir más detalles sobre:

  1. Qué parte específica de la página estás intentando cambiar.
  2. Qué cambio estás intentando hacer.


La parte superior, quiero hacerla así
https://pvpfarm.com
Quiero añadir radio de borde como la parte inferior (de abajo)
Todo lo que quiero es tener algo de espacio en la parte superior entre ella y el encabezado.

Mi inglés es malo, lo siento. Gracias por la ayuda

Está bien, tu inglés es bueno, ¡pero el código puede ser complicado de explicar! Gracias por añadir más detalles. Creo que el problema tiene sentido.

A veces puedes usar margin-top para añadir más espacio arriba.

¡Pero no funciona cuando te desplazas!

Esto se debe a que hay position: fixed en la parte body:before, por lo que siempre permanecerá en el mismo lugar de la pantalla. Cambiémoslo a position: absolute en su lugar. ‘Absolute’ nos permite decirle qué tan lejos de los lados queremos los bordes. Necesitamos decirle que use body para los lados, así que necesitamos añadir este código:

body {
  position: relative;
}

(Si quieres aprender más sobre position, fixed y absolute aquí aquí hay una publicación con ejemplos)

Ok, eliminemos min-height: 100% de body:before, porque queremos que sea más corto que el 100%. ¡Ahora podemos controlar dónde están la parte superior e inferior! Añadamos top: 70px y bottom: 30px. (Top necesita ser lo suficientemente grande como para pasar por encima del encabezado desde la parte superior de la pantalla).

¿Parece como querías? Hazme saber si tiene sentido. :slight_smile:

4 Me gusta

¡Eres increíble!
Gracias por enseñarme en lugar de darme códigos listos para usar. :heart:
@bryce

3 Me gusta

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.