Taille du corps / Quel code est requis ?

Salut tout le monde.
J’ai ajouté un rayon de bordure à ce code et j’ai rendu la partie inférieure comme je le voulais.
Mais je n’arrive pas à corriger la partie supérieure.

Quels codes dois-je ajouter pour que la partie supérieure ressemble exactement à la partie inférieure ?

comme : top-height-size: -30%; ? mais cela ne fonctionne pas

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);
}

Je suis désolé, mais il ne semble pas clair ce que vous devez faire. Pourriez-vous s’il vous plaît ajouter plus de détails sur :

  1. Quelle partie spécifique de la page vous essayez de modifier.
  2. Quelle modification vous essayez d’apporter.


La partie supérieure, je veux la faire comme ceci
https://pvpfarm.com
Je veux ajouter un rayon de bordure comme la partie inférieure (en dessous)
Tout ce que je veux, c’est avoir un peu d’espace en haut entre elle et l’en-tête.

Mon anglais est mauvais, désolé. Merci pour votre aide

Ce n’est pas grave, votre anglais est bon, mais le code peut être délicat à aborder ! Merci d’avoir ajouté plus de détails. Je pense que le problème est logique.

Parfois, vous pouvez utiliser margin-top pour ajouter plus d’espace au-dessus.

Mais cela ne fonctionne pas lorsque vous faites défiler !

C’est parce qu’il y a position: fixed dans la partie body:before, donc cela restera toujours au même endroit sur l’écran. Changeons-le en position: absolute à la place. « Absolute » nous permet de lui indiquer à quelle distance des bords nous voulons que les bords se trouvent. Nous devons lui dire d’utiliser body pour les bords, nous devons donc ajouter ce code :

body {
  position: relative;
}

(Si vous voulez en savoir plus sur position, fixed et absolute, voici ici un article avec des exemples)

Ok, supprimons min-height: 100% de body:before, car nous voulons qu’il soit plus court que 100 %. Nous pouvons maintenant contrôler où se trouvent le haut et le bas ! Ajoutons top: 70px et bottom: 30px. (Le haut doit être assez grand pour dépasser l’en-tête du haut de l’écran).

Est-ce que cela correspond à ce que vous vouliez ? Faites-moi savoir si cela a du sens. :slight_smile:

4 « J'aime »

Tu es incroyable !
Merci de m’apprendre au lieu de me donner des codes tout faits. :heart:
@bryce

3 « J'aime »

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