[Résolu] Problème d'affichage HTML/CSS sur site mais pas en local

Bonjour,

tout d'abord merci pour votre site qui m'a vraiment aidé dans mon travail.

Voici mon problème,

je suis en train de monter un site web pour une activité complémentaire. Le site se divise en 3 sections classiques; un header une main et un footer.

Actuellement en travaux j'ai modifié la partie main en y insérant du texte et une image.

Lorsque je test en local, donc sur la machine où je code, cela fonctionne nickel et l'affichage est comme souhaité, mais lorsque je le déploie sur le serveur l'affichage n'est plus comme souhaité.

Sur l'image jointe vous voyez le site comme je le vois en local et souhaiterait le voir online (image principale avec le texte en blanc) et sur la partie à gauche de cette image le texte comme il apparait réellement online.



Je précise avoir bien supprimer l'ancien fichier style, fait un refresh, les polices sont bien sur le serveur, etc... sur le serveur.

Le HTML pour la partie main:

	
<main class="main">
	
<img src="images/wip.png" alt="Work in Progress"  title="Work in Progress">
			
<br>
<br>
Ce site est actuellement en phase de construction.
<br>
<br>
Les données affichées doivent être finalisées.
<br>
<br>
Il s'agit d'un test des menus haut et bas.
				
</main>

et le CSS

/* MAIN */

.main { 
  margin-top:250px; 
  text-align: center;  
  color:  #ffffff;
  font: normal 36px 'Provicali';
}

Une idée du pourquoi cette différence en local et en ligne? merci de votre aide
Modifié par Irwin (11 Jun 2020 - 08:58)

Salut,
Les balises <br> sont à évités.
Essaie de mettre ton texte dans des balises <p> ou <hx> (x étant le nombre de 1 à 6) pour indiquer au navigateur qu'il y a du texte.
Du coup ça donnerait ça :

<main class="main">
<img src="images/wip.png" alt="Work in Progress"  title="Work in Progress">
			
<h3>
Ce site est actuellement en phase de construction.
</h3>
<h3>
Les données affichées doivent être finalisées.
</h3>
<h3>
Il s'agit d'un test des menus haut et bas.	
</h3>
		
</main>

/* MAIN */

.main { 
  margin-top:250px; 
  text-align: center;  
  color:  #ffffff;
  font: normal 36px 'Provicali';
}
.h3 {
margin-top: 50px; /** Mets la valeur qui t'intéresse**/
margin-bottom: 50px;
}

Je n'ai pas utilisé flexbox, mais tu peux aussi faire avec si jamais tu veux mieux gérer l'ensemble de ton texte.
Modifié par siphelis (11 Jun 2020 - 09:23)

Merci je regarde à çà et te tiens au courant

Re,

cela ne fonctionne toujours pas, les données que je voulais centrées sont toujours à gauche et pas dans le bon format.

Autant pour moi,

cela fonctionne nickel simplement un mauvais rafraichissement du site, après suppression des cookies tout est ok et la page s'affiche nickel.

Merci à toi