Fichier CSS qui ne se charge pas sur la page de connexion

**GDS_Strou** · 26/01/2016, 15h16

Bonjour,
Je suis actuellement sur le développement d'une application web en java.
J'ai configuré un fichier CSS qui fonctionne parfaitement, mais uniquement une fois que l'utilisateur est connecté.

Sur la première page de login au lancement de l'application, mon fichier CSS ne se charge pas.

Est ce que quelqu'un sait d'où peut venir ce problème ?
Quels fichier dois-je vous transmettre pour vous orienter ?

Merci d'avance pour votre aide.

Invité · 26/01/2016, 19h56

Bonjour,

Envoyé par GDS_Strou

..., mais uniquement une fois que l'utilisateur est connecté...

C'est certainement que tu ne l'as pas mis au bon endroit, ou dans le bon fichier.
Il n'est donc sans doute pas présent dans le code, avant connexion.

Mais sans code... difficile d'en dire plus...

**GDS_Strou** · 27/01/2016, 08h49

Merci pour l'aide, donc voici ma page de connexion et le css. Sur celle-ci, tant que je ne suis pas connectée, je n'ai ni affichage du fond d’écran, ni affichage de tout ce qui concerne Primefaces.

voici la page de connexion :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<h:html xmlns="http://www.w3.org/1999/xhtml"
       xmlns:ui="http://java.sun.com/jsf/facelets"
       xmlns:h="http://java.sun.com/jsf/html"
       xmlns:f="http://java.sun.com/jsf/core"
       xmlns:p="http://primefaces.org/ui"
       xmlns:pe="http://primefaces.org/ui/extensions">
 
<h:head>
       <h:outputStylesheet name="style.css" library="css" />
       <h:outputStylesheet name="icones.css" library="css" />
       <link rel="icon" href="resources/images/favicon.ico" type="image/ico" />
       <script src='resources/javascripts/scripts.js' />
</h:head>
 
<h:body>
       <table style="width: 100%;" border="0">
             <tr>
                    <td colspan="1" style="width: 38%">
                           <center>
                                  <img src="./resources/images/logo200x200.png"/>
                           </center>
                    </td>
 
                    <td colspan="1" style="width: 38%">
                           <center>
                                  <img src="./resources/images/as200x200.png" />
                           </center>
                    </td>
             </tr>
 
       </table>
 
       <br /><br /><br /><br />
 
       <table border="0" style="width: 100%;">
             <tr>
                    <td colspan="1" style="width: 25%">
                          <br/>
                    </td>
 
                    <td colspan="1">
                           <center>
                                  <p:panel header="Authentification" style="width: 100%; ">
                                        <p:messages id="messages1" showDetail="true" autoUpdate="true" closable="true"  />
 
                                        <h:form id="connexion">
                                               <table>
                                                      <tr>
                                                            <td><br /> </td>
                                                      </tr>
 
                                                      <tr>  
                                                      <!--   <td><p:graphicImage value="/resources/images/Icon-warning2.png" title="L'Identifiant est obligatoire" /></td> -->
                                                            <td><p:outputLabel for="identifiant" value="Identifiant :" /></td>
                                                            <td><p:inputText id="identifiant" value="#{connexionBean._identifiant}"  /></td>
 
                                                            <td><p:message for="identifiant" display="Identifiant" /></td>
 
                                                      </tr>
                                                      <tr>
                                                            <td><p:outputLabel value="Mot de passe :" /></td>
                                                            <td><p:password id="motDePasse" value="#{connexionBean._motDePasse}"   /></td>
                                                      </tr>
                                                      <tr>
                                                            <td><br /></td>
                                                      </tr>
 
                                                      <tr>
 
                                                            <td colspan="3"><center>
                                                                          <p:commandButton value="Se Connecter" update="connexion" actionListener="#{connexionBean.seConnecter}" />           
                                                                   </center>
                                                            </td>
                                                      </tr>
                                               </table>
                                        </h:form>
 
                                  </p:panel>
                           </center>
 
 
 
                    </td>
                    <td colspan="1" style="width: 25%">
                           <br/>
                    </td>
             </tr>
       </table>
 
       <div id="footer">
                    <table border="0" width="100%">
                           <tr>
 
                                  <td style="width: 90%; font-size: 12px">Version 0.1</td>
                                  <td style="width: 10%"><img
                                        src="./resources/images/logo.png" alt="" /></td>
                           </tr>
                    </table>
                    <!-- La ligne suivante blockUI permet d'éviter un problème avec le script JS lors du chargement des pages -->
                    <pe:blockUI></pe:blockUI>
       </div>
       <!--  fin footer -->
</h:body>
</h:html>

voici le css :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
 
 
/** CSS **/
 
.ui-outputlabel-rfi
 
{
       display: none;
       color: yellow;
}
 
 
h1
{
       color: #9BCC60;
    font-family: tahoma;
    font-size: 70px;
}
 
#page
{
       min-height: 100%;
       position: relative;
}
 
#content
{
       height: auto;
    overflow: auto;
    position: relative;
      top: 160px
    width: 100%;
 
}
 
#header
{
       position: absolute;
    width: 100%;
    color: #9BCC60;
    top: -8px;
}
 
#menu
{
      position: relative;
      top: 145px;
    width: 100%;
}
 
#footer
{
    clear: both;
    color: white;
    height: 25px;
    color: #9BCC60;
    position: relative;
       top: 175px;
    width: 100%;
}
 
body {
 
    background-color: #695444;
    color: #9BCC60;
    background-image: url("./../resources/images/fondPersee.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;   
}
 
 
 
.css1{
       padding-left:300px;
}
 
 
 
.css2{
 
       padding-left:400px;
}
 
.css3{
       padding-left:300px;
}
 
.css4{
       padding-left:400px;
}
 
 
 
.ligneTab{
       display: table-cell;
}
 
.celluleLibTab{
       width: 150px;
       height: 30px;
}
 
.celluleEscTab{
       width: 80px;
       height: 30px;
}
 
.chkbox{
padding-top:10px;
padding-left:10px !important;
}

Invité · 29/01/2016, 10h25

Bonjour,

1/ ce n'est pas le contenu du fichier qui nous intéresse, mais le nom du fichier.
Quel est le nom du fichier CSS qui ne se charge pas ?

style.css ?
icones.css ?

Ce sont les seuls qu'on voit dans le code HTML.

**GDS_Strou** · 29/01/2016, 10h42

C'est le style.css qui ne se charge pas

Invité · 29/01/2016, 11h38

Envoyé par GDS_Strou

...je n'ai ni affichage du fond d’écran...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
body {
 
    background-color: #695444;
    color: #9BCC60;
    background-image: url("./../resources/images/fondPersee.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;   
}

"./../resources/images/fondPersee.jpg" ??

C'est ./ ou ../, mais pas les deux !

Envoyé par GDS_Strou

...ni affichage de tout ce qui concerne Primefaces...

Primefaces ??

kezako ?
rien vu dans ton code CSS. Il doit manquer le fichier...

**GDS_Strou** · 29/01/2016, 12h31

"./../resources/images/fondPersee.jpg" ??

C'est ./ ou ../, mais pas les deux !

J'ai corrigé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
background-image: url("../resources/images/fondPersee.jpg");

Mais toujours pas d'image de fond tant que je ne suis pas connectée

**Amnael** · 30/01/2016, 10h39

Si j'ai bien compris ta fonction qui doit changer le css, c'est celle qui se déclenche lorsque tu appuies sur le bouton de connexion.

Je pense que la fonction en question est dans le fichier js que l'on ne peut pas voir d'ici, peut-être y a t-il un soucis avec cette fonction là justement ? Est-ce que tu as testé de regarder si tu avais l'affichage de base en supprimant cette fonction ?

Sa peut aussi venir d'un soucis dans tes dossiers comme jreaux te le signale.

Est-tu certain que style.css et icone.css sont dans le même dossier que ta page html ? Cela me semble bizarre.

Parce que, même si je ne connais pas la syntaxe que tu utilises, je trouve bizarre que tu n'indiques pas le lien pour la feuille de style que tu veux appliquer au départ. Il te manquerait pas un src ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
<h:outputStylesheet name="style.css" library="css" />
       <h:outputStylesheet name="icones.css" library="css" />

Fichier CSS qui ne se charge pas sur la page de connexion

CSS

Discussions similaires

Partager

Partager