[Résolu] Rien ne s'affiche sur ma page

Bonjour à vous,
Rien ne s'affiche sur ma page et j'ai beau chercher ---> Impossible de trouver.

Mon CSS :

.top {
/*Essai backgound-color marche - Ce niveau fonctionne */
  position: relative;
  height: calc(100vh - 120px);
  min-height: 500px;
  max-height: 1100px;
 background-color:gold;
  overflow: hidden;
}
.top::before {
  height: 290px;
  width: 100%;
  background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0)), to(#fff));
  background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, #fff 100%);
  content: '';
  position: absolute;
  bottom: 0px;
}
/* Essai background couleur ne fonctionne pas - Commencement des prises de tête */
.top .container {
  position: relative;
  width: 50%;
  height: 100%;
  overflow: hidden;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: red;
  opacity: 0;
}

.top .container {
  height: 100%;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-pack: center;
  justify-content: center;
  position: absolute;
  overflow: hidden;
}

/*background-color ne fonctionne pas / le text de s'affiche pas*/
.top .container .contain-txt {
  width: 50%;
  padding-left: 55px;
  background-color: white;
}

.top .contain-img {
/*ma photo ne s'affiche pas le lien est bon je vérifie avec les outils navigateur*/
  position: absolute;
  width: 50%;
  right: 0px;
  top: 0px;
  height: 100%;
  overflow: hidden;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: 0;
}

Merci de vos éclairages.

correction du balisage du code pour une meilleur lisibilité
Modifié par gcyrillus (22 Sep 2023 - 12:32)

Bonjour,
étrange, tes accolades pour entourer le css !
code=css et /code doivent être entourés de [....]. Le texte css ne doit pas être inclus dans ces crochets.
La présentation sera plus facile à lire.
C'est sûr qu'avec des opacity:0; rien ne va s'afficher.
Plus des choses étranges. .top .container à la fois en position relative et absolute ?
Le html serait le bienvenu.

Bonjour Bongota,
Pour les doubles accolades : c'est les accolades/code d'alsacréations.

Tu as raison, autant bien faire de suite, les messages ne sont pas sur mon code, c'était juste pour que vous puissiez savoir à partir de quel moment cela ne fonctionnait pas.

Que dire sinon que tu es Top, c'est "opacity" qui était en cause.
Merci beaucoup.