Style CSS ne s'appliquant pas

**Jenojen** · 08/08/2011, 16h48

Bonjour,

Je concois un site et j'ai récupéré un style css d'une gallerie d'image. Quand je le test dans une page vierge comme présenté tout fonctionne, quand j'essaie de l'intégrer à mon site web ça se corse.

Voici le code qui fonctionne très bien si on lui fout la paix.

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Galerie d'images</title>
 
<style type="text/css">
 
/* general */
 
 
 
	/* // here comes the goodnes  */
 
		ul#gallery, ul#gallery li{
			margin:0;
			padding:0;
			list-style:none;
			}
		ul#gallery{
			width:400px;
			height:375px;
			position:relative;
			background:#e1e1e1 url(bg_preview.gif) no-repeat 50% 40%;
			}
		ul#gallery li{
			float:left;
			display:inline;
			margin-top:300px;
			}
		ul#gallery a span{
			display:none;
			}
		ul#gallery a:hover{
			background:none;
			z-index:100;
			}
		ul#gallery a:hover span{
			position:absolute;
			width:400px;
			height:300px;
			float:left;
			top:0;
			left:0;
			display:block;
			}
 
	/* // goodnes  */
 
/* // general */
 
</style>
 
	</head>
	<body>
 
		<h1>Galerie d'images</h1>
 
		<ul id="gallery">
			<li>
				<a href="http://cssglobe.developpez.com/">
					<img src="02_1s.jpg" alt="gallery thumbnail">
					<span><img src="02_1.jpg" alt="gallery image"></span>
				</a>
			</li>
			<li>
				<a href="http://cssglobe.developpez.com/">
					<img src="02_2s.jpg" alt="gallery thumbnail">
					<span><img src="02_2.jpg" alt="gallery image"></span>
				</a>
			</li>
			<li>
				<a href="http://cssglobe.developpez.com/">
					<img src="02_3s.jpg" alt="gallery thumbnail">
					<span><img src="02_3.jpg" alt="gallery image"></span>
				</a>
			</li>
                        <li>
				<a href="http://cssglobe.developpez.com/">
					<img src="02_4s.jpg" alt="gallery thumbnail">
					<span><img src="02_4.jpg" alt="gallery image"></span>
				</a>
			</li>
 
		</ul>
	</body>
</html>

Cependant si j'en recupère le style pour l'intégrer à mon fichier style.css et que j'intègre le code html dans mon appli pas moyen d'appliquer le css. Mes images s'affichent bêtement sans aucun style appliqué dessus.

Voici comment se présente mon application:
Dans mon fichier style.css j'ai ajouté ça donc

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
ul#gallery, ul#gallery li{
			margin:0;
			padding:0;
			list-style:none;
			}
		ul#gallery{
			width:400px;
			height:375px;
			position:relative;
			background:#e1e1e1 url(bg_preview.gif) no-repeat 50% 40%;
			}
		ul#gallery li{
			float:left;
			display:inline;
			margin-top:300px;
			}
		ul#gallery a span{
			display:none;
			}
		ul#gallery a:hover{
			background:none;
			z-index:100;
			}
		ul#gallery a:hover span{
			position:absolute;
			width:400px;
			height:300px;
			float:left;
			top:0;
			left:0;
			display:block;
			}

Et dans mon appli:

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
 function accueil() {
 
		$content = '<h1>Galerie d images</h1>
 
                    <ul id="gallery">
			<li>
				<a href="http://cssglobe.developpez.com/">
					<img src="./images/02_1s.jpg" alt="gallery thumbnail">
					<span><img src="./images/02_1.jpg" alt="gallery image"></span>
				</a>
			</li>
			<li>
				<a href="http://cssglobe.developpez.com/">
					<img src="./images/02_2s.jpg" alt="gallery thumbnail">
					<span><img src="./images/02_2.jpg" alt="gallery image"></span>
				</a>
			</li>
			<li>
				<a href="http://cssglobe.developpez.com/">
					<img src="./images/02_3s.jpg" alt="gallery thumbnail">
					<span><img src="./images/02_3.jpg" alt="gallery image"></span>
				</a>
			</li>
                         <li>
				<a href="http://cssglobe.developpez.com/">
					<img src="./images/02_4s.jpg" alt="gallery thumbnail">
					<span><img src="./images/02_4.jpg" alt="gallery image"></span>
				</a>
			</li>
 
		</ul>
 
</html>';
                $this->appli->setContent($content);
    }

Donc voila en gros pas moyen d'appliquer ce style en récupérant le css dans mon fichier style.css.

Merci de bien vouloir m'aider.
http://hpics.li/09e7f46 Ce quand j'applique le code tel quel.
http://hpics.li/88bce3f Ce que ça donne quand j'intègre à mon appli.

**Jenojen** · 08/08/2011, 18h04

Je n'édite pas pour la postérité, je travaillais sur la mauvaise feuille de style!

Style CSS ne s'appliquant pas

CSS

Discussions similaires

Partager

Partager