28172 sujets

CSS et mise en forme, CSS3

[Résolu] Background-image pas aparent sur Firefox & opéra

Bonjour a tous, je suis entrain d'incorporé une galerie photo dans mon site qui sera dans une Iframe (je suis obligé d'utiliser une iframe, demande du chef de projet) j'ai recuperée le script de cette galerie sur un site ( http://galeriephp.free.fr/) qui est relativment simple et assez modifiable par son CSS... Smiley smile

Par contre derirere cette galerie photo, je dois metre une image de fond, que j'ai mi comme dans tout les pages aplé dans cette iframe dans le css avec un background-image, ca marche tres bien sur IE mais par contre ca ne fonctionne pas sur Firefox et Opéra... Smiley bawling

J'pense que ca doit etre un bug des navigateur, peut etre avez vous une solution... Smiley confused



Le css du contenu qui est dans mon iframe:



*{
	list-style-type: none;
	margin : 0px;
	padding:0px;
}

body{

	/*height: 100%;*/
	margin: 0px;
	padding: 0px;
}


#conteneur{
	width: 460px;
	height: 470px;
	margin: 0px;
	background-image: url(../images/iframe_contenu.jpg);
	
}


Le css de la galerie Photo:



#div_menu
{ position: absolute;
  padding-top: 10px;
  padding-left: 0px;
  width: 200px;
  text-align: center;
}

#div_menu a
{
  font-family: Verdana;
  font-size: 12pt;
  font-weight: bold;
  text-decoration: none;
  color: Maroon;
}

#div_menu li
{
  font-family: Arial;
  font-size: 10pt;
  color: Black;
  position: relative;
  left: 40px;
  top:5px;
}

#div_menu li a
{
  font-family: Arial;
  font-size: 10pt;
  color: Red;
  text-decoration: none;
}

#div_menu li a.active
{
  font-family: Arial;
  font-size: 10pt;
  color: Red;
  text-decoration: none;
}

#div_photos
{
  position: relative;
  top: 50px;
  margin-left: 50px;
  margin-right: auto;
  text-align: center;
  width: auto;
  height: auto;
  text-align: left;
  background: transparent;
  font-size : 8pt;
  font-family : Verdana;
  color: #555555;
  overflow: auto;
}

.img-shadow {
  float:left;
  background: url(include/shadowAlpha.png) no-repeat bottom right !important;
  background: url(include/shadow.gif) no-repeat bottom right;
  margin: 10px 0 0 10px !important;
  margin: 10px 0 0 5px;
  }

.img-shadow img {
  display: block;
  position: relative;
  background-color: White;
  border: 1px solid #a9a9a9;
  margin: -6px 6px 6px -6px;
  padding: 4px;
  }


J'pense pas que j'ai besoin de vous metre le HTML de la page de l'iframe y a juste une div conteneur.


Dite moi si vous avez besoin de precision... Smiley sweatdrop



Merci d'avance!!! Smiley cligne
Modifié par Chat (09 May 2008 - 13:53)
j'ai pas trop comprie ta question, c'est si la page est en ligne (non le site n'est pas en ligne) ou si j'l'ai testé sur un vrai serveur web? Smiley sweatdrop
La question, dans sa version in extenso, est: y a-t-il une page en ligne où l'on pourrait constater le problème, ce qui permettrait:
1. de visualiser le problème directement;
2. d'accéder au code HTML complet;
3. d'accéder au code CSS complet;
4. de vérifier que le problème n'est pas dû (éventuellement) à un script JS;
5. de tester «à la volée» des correctifs en utilisant des outils tels que Web Developer Toolbar ou Firebug.
Désoler je n'ai pas eu le temps de revenir plus tot... Smiley sweatdrop



J'viens de le mettre en ligne si ca peux vous aider... Smiley cligne

Il faut cliquer sur le lien galerie c'est la ou est le beug entre IE et Firefox... Smiley ohwell


Artkateo
Bonjour,

La plupart des pages que tu inclues dans l'iframe ont dans leur code:
<link href="../css/page.css" rel="stylesheet" type="text/css" />


À l'inverse, la page http://publicore.net/artkateo/galerie/galerie.php a le code suivant:
<link href="file:///C|/wamp/www/artkateo/css/page.css" rel="stylesheet" type="text/css" />


Sur mon poste (sous Linux), je n'ai pas de disque C. Et même si j'en avais un, je doute que le chemin C|/wamp/www/artkateo/css/page.css pointe vers un fichier existant sur mon poste.

Bien entendu, en corrigeant l'attribut href cela marche sans problème. Smiley cligne
Sujet clos
Aller à