Probleme avec un slider jquery

Bonjour alors voila j'ai un probleme avec mon slider jquery quand je le met dans un cadre le petit espace texte prend toute la forme du block en question...

http://bellamydof.1allo.com/newssite/pro1.jpg

aux lieu de faire sa !!

http://bellamydof.1allo.com/newssite/prob2.jpg

voici mon code css du cadre :

#container .col2 {font-family : Verdana, Arial, sans-serif; border: none; width : 331px; height : 138px; padding : 5px 0 0 0; background : url("layouts/templates/frigost/g_2.jpg") no-repeat;}

le Css du slider :

#newsdefi { float : left; height : 138px; margin-right : 3px; padding-right : 3px; width : 331px;}
#gallery { position : relative; height : 138px; width : 331px }
#gallery a {float : left; position : absolute }
#gallery a img { border : none }
#gallery a.show { z-index : 4 }
#gallery .caption { z-index : 6; height : 45px; width : 331; position : absolute; bottom : 0; font-size : 13px; background-color : #204152; color : #fff;}
#gallery .caption .tituloslider  { font-size : 18px; font-family : Verdana, Arial, sans-serif; color : #33FFFF;}
#gallery .caption .galCapholder  { margin : 5px; display : block}
#gallery .caption .content { font-size : 13px; text-align : justify;}
#plusGalleryStack { width : 331px; height : 138px; float : left; padding : 0 5px 0 0}
#gallery2 { padding : 5px; min-height : 2500px;}

j'ai bon chercher mais je trouve vraiment pas le bug en questions

voici le code html

	<div class="col2">
	<div id="newsdefi">
      <div id="gallery">
        <a class="show" style="opacity: 1; width: 331px; display: block;"> <img src="news2/001.jpg" title="&#171; N le maudit &#187;" alt="Serez vous cs !!" border="0" height="138" width="331"></a>
				<a style="opacity: 0;"> <img src="news2/002.jpg" title="Le nouveau défi de Dofus" alt="Serez vous cs !!" border="0" height="138" width="331"></a>
		<a style="opacity: 0;"> <img src="news2/003.jpg" title="Bellamy Recrutes !!" alt="Bellamy recrborder="0" height="138" width="331"></a>
		<a style="opacity: 0;"> <img src="news2/004.jpg" title="Forum Bellamy" alt="Bientôt un !!" border="0" height="138" width="331"></a>
		        <div style="opacity: 0.8; width="331" display: block;" class="caption">
          <div class="galCapholder">
            <div class="tituloslider"></div>
            <div style="opacity: 0.8;" class="content"></div>
          </div>
        </div>
      </div>
	  </div>
   </div>

Merci d'avance
Modifié par bellamy (21 Jun 2010 - 12:53)

enfinte le cadre ca va mais c'est le petit espace texte avec l'effet bleu qui me pose des probleme et je c'est pas comment regler sa !!!

Merci d'avance

C'est un problème de CSS, donc si ton code n'est pas syntaxiquement correct, les CSS peuvent ne pas fonctionner.

As tu valider ta page html avec le validateur que je t'ai donner en lien ?

oui et c'est pire lol voila se que sa donne :

http://bellamydof.1allo.com/newssite/teste1.php

Alors rapidement, ta page n'est pas du tout valide !

ID doit être unique (utilise des class CSS, ça marche tout aussi bien, et tu peux les utiliser autant de fois que tu veux !)

Tu encode ton site en UTF-8, vérifie que ton éditeur de texte encode lui aussi en UTF-8 car tous tes caractères ne sont pas bien encodé, d'ailleurs, ça empêche le validateur de fonctionner.

D'ailleurs, ton script fonctionne très bien !

http://www.grid-france.net/forum/img/uploads/miniature/2_21-06-2010_14-07-01.png

Ce que tu voudrais avoir, ce place plus bas dans ta page.

Corrige toutes tes erreurs de syntaxe, et ensuite reviens par ici si tu as toujours des problèmes.

j'utilise netopad ++ comme editeur de texte et je suis débutant pourais tu m'aider a me donner des exemple de comment je doit faire etc merci d'avance...

Pour changer l'encodage de notepad++ :

salut j'ai fait comme ta dit changer l'encodage etc mais sa change rien

http://bellamydof.1allo.com/newssite/teste2.php

Personne d'autre c'est comment je peux regler l'espace texte en bleu parseque la sa me sort des yeux

merci d'avance

Je n'ai plus accès à ta page de test !