Problème affichage background CSS
Résolu
Dorenas
Messages postés
8
Date d'inscription
Statut
Membre
Dernière intervention
-
Mihawk Messages postés 4315 Date d'inscription Statut Contributeur Dernière intervention -
Mihawk Messages postés 4315 Date d'inscription Statut Contributeur Dernière intervention -
Bonjour,
Je suis loin d'être un expert en CSS, et me voici aujourd'hui face à deux problèmes qui m'ont fait blanchir pas mal de cheveux.
1) le premier est le suivant: J'utilise une image de fond pour une page html ( Accueil.php ).
Je l'ai associé à son body de la façon suivante :
Voici la partie de mon CSS que j'utilise pour afficher dans le body
Le fait est que , quand je charge la page, je suis obligé de la rafraîchir pour voir l'image apparaître. Tout les liens qui pointent vers cette pages donnent le même résultat : fond blanc basique => F5 => Mon image est là.
A l'aide :'(
2) le deuxième problème est plus une petite question. Mon menu est de cette forme :
et je souhaite centrer verticalement les mots présents dans les divs de sous menu.
J'utilise donc le CSS suivant :
Seulement, cela ne change rien du tout, le text-align center fonctionne mais pas le vertical align.
La réponse à cette question est probablement stupide mais la après pas mal de recherche j'ai besoin d'un avis extérieur ...
Merci d'avance pour vos réponses !
Dorenas
Je suis loin d'être un expert en CSS, et me voici aujourd'hui face à deux problèmes qui m'ont fait blanchir pas mal de cheveux.
1) le premier est le suivant: J'utilise une image de fond pour une page html ( Accueil.php ).
Je l'ai associé à son body de la façon suivante :
<html >
<body class="contentbg" bgcolor="#FFFFFF">
<div id="logo">
<a href="Accueil.php"><img style="border:none" src="logo.jpg"></a>
</div>
[...]
</body>
</html>
Voici la partie de mon CSS que j'utilise pour afficher dans le body
.contentbg
{
font-family: Georgia, serif;
background: url(content.jpg) top center no-repeat #c4c4c4;
color: #3a3a3a;
}
Le fait est que , quand je charge la page, je suis obligé de la rafraîchir pour voir l'image apparaître. Tout les liens qui pointent vers cette pages donnent le même résultat : fond blanc basique => F5 => Mon image est là.
A l'aide :'(
2) le deuxième problème est plus une petite question. Mon menu est de cette forme :
<div id="menu" > <div class="menu" id="menu1" > <a href="#">Menu</a> </div> <div id="sousmenu1"> <div class="sousmenu"> <a href="choix1.php">Choix 1</a> </div> <div class="sousmenu"> <a href="choix2.php">Choix 2</a> </div> <div class="sousmenu"> <a href="choix3.php">Choix 3</a> </div> <div class="sousmenu"> <a href="Help.php">Aide</a> </div> </div> </div>
et je souhaite centrer verticalement les mots présents dans les divs de sous menu.
J'utilise donc le CSS suivant :
.menu{
height:18px;
width:150px;
padding:2px 0;
background:#404040;
color:#fff;
vertical-align: middle;
text-align:center;
}
.sousmenu{
height:32px;
width:150px;
padding:1px 0;
background:#808080;
color:#fff;
text-align:center;
vertical-align: middle;
}
Seulement, cela ne change rien du tout, le text-align center fonctionne mais pas le vertical align.
La réponse à cette question est probablement stupide mais la après pas mal de recherche j'ai besoin d'un avis extérieur ...
Merci d'avance pour vos réponses !
Dorenas
A voir également:
- Problème affichage background CSS
- Affichage double ecran - Guide
- Problème affichage fenêtre windows 10 - Guide
- Windows 11 affichage classique - Guide
- Windows 7 logon background changer - Télécharger - Thèmes & Fonds d'écran
- Background color css ✓ - Forum CSS
6 réponses
Salut,
Pour ton premier problème, enlève "bgcolor="#FFFFFF"" de ta balise body ca devrait être mieux.
Pour ton second problème, la propriété vertical-align n'est pas faite pour centrer du texte verticalement, je n'ai plus la syntaxe en tête pour faire ce que tu veux, tu devrais pouvoir trouver sur internet :)
Pour ton premier problème, enlève "bgcolor="#FFFFFF"" de ta balise body ca devrait être mieux.
Pour ton second problème, la propriété vertical-align n'est pas faite pour centrer du texte verticalement, je n'ai plus la syntaxe en tête pour faire ce que tu veux, tu devrais pouvoir trouver sur internet :)
Parfait pour le 2eme problème ! c'est résolu !
Par contre le premier problème perssiste , je dois même dire que c'est pire étant donné que maintenant même en appuyant sur F5, le background n'apparaît plus.
Par contre le premier problème perssiste , je dois même dire que c'est pire étant donné que maintenant même en appuyant sur F5, le background n'apparaît plus.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Hello,
Essaye de décomposer un peu ton CSS :
Essaye de décomposer un peu ton CSS :
.contentbg
{
font-family: Georgia, serif;
background-color: #c4c4c4;
background-image : url('content.jpg');
background-position: top center;
background-repeat: no-repeat;
color: #3a3a3a;
}
Je viens de faire la modification , c'est interessant parce que cela fonctionne mais pas parfaitement. En effet auparavant, j'avais un BG gris (c'est d'ailleurs assez bisarre puisque je n'ai pas du tout fait apparaître de gris dans ma page ) maintenant j'ai bien mes images qui se chargent bien , mais avec un petit tant de latence d'une demi seconde pendant laquelle je vois clairement le fond gris, qui fait après place à mon image de fond.
On touche au but ! merci à vous=
On touche au but ! merci à vous=
/* pense à mettre des commentaires entre ces deux balises ça aide pour la maintenance */
Voir ici: http://fr.selfhtml.org/css/proprietes/arriereplan.htm leds propriétés CSS.
.contentbg { /* image d'arrière plan */
background-image: url(arriereplan2.gif);
margin:Xpx; /* marge gauche si besoin */
margin: Xpx; /* marge droite si besoin */
background-repeat:no-repeat; /* pas de répétition d'image */
}
Voir ici: http://fr.selfhtml.org/css/proprietes/arriereplan.htm leds propriétés CSS.