Forums des Zéros

28 juin 2006 à 17:00:19

exactement

sinon, quelqu'un saurait me dire où sont mes erreurs ?

28 juin 2006 à 17:07:43

Tu peux garder ta première structure HTML, elle est correcte, sauf que tu devrais utiliser un balisage approprié pour ta liste de liens de navigation.

Il te suffit d'annuler le margin de p dans le menu qui est à la cause des espaces indésirables, soit #menu_left p{margin:0;}

28 juin 2006 à 17:46:37

j'ai essayé, mais cela ne fonctionne pas... :euh:

Edit : Mais tu dois tout de même avoir raison, car lorsque je supprime les <p>, il n'y a plus d'espace.
A-t-on le droit de mettre du texte dans un <div> sans l'entourer d'une autre balise block ?

2ème Edit : (on ne s'en lasse pas

) Sauriez vous pourquoi les images de fond ne s'affichent pas sous IE ?

28 juin 2006 à 18:25:41

Faut voir ton code et un rendu, j'ai du mal à me figurer là pour IE.
Un background ne s'affiche que sur la surface de son conteneur, garde ça à l'esprit, ou poste ce que je viens de te demander.

Sinon, si, ça devrait marcher. Tu devrais mettre la règle que je t'ai donnée plus haut soit tout en bas de la feuille de style, soit avec un flag !important juste histoire de voir si c'est pas uniquement parce que la règle est écrasée après.

28 juin 2006 à 18:26:47

J'ai le même problème avec IE. Mes images de fond ne s'affichent pas...

28 juin 2006 à 19:36:56

voici les codes complets (j'ai pris l'exemple de m@teo histoire d'alléger le contenu) :

<!DOCTYPE html PUBLIC "–//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1–strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Bienvenue sur mon site !</title>
<meta http–equiv="Content–Type" content="text/html; charset=iso–8859–1" />
<link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="new8c.css" />
</head>
<body>
<div id="header">
</div>

<div id="menu_left"> 
<div class="menu_haut"><p>Menu</p></div>
<div class="menu_debut_st"></div>
<div class="menu_milieu"> <p>
<a href="lien1.html">lien1</a><br />
<a href="lien2.html">lien2</a><br />

</p>
</div>
<div class="menu_fin_st"></div>
<div class="menu_debut_st"></div>
<div class="menu_milieu"> <p> lo lo lo lo lo lo lo lo<br />lol lol olo <br />lo lo lo lo lo lo <br/> lol olo lo lo<br /> lo lo lo lo lo lo </p></div>
<div class="menu_fin_st"></div>
<div class="menu_bas"></div>

</div>

<div id="corps">
<h1>Mon super site</h1>

<p>
Bienvenue sur mon super site !<br />
Vous allez adorer ici‚ c'est un site génial qui va parler de... heu... Je cherche encore un peu le thème de mon site :–D
</p>

<h2>A qui s'adresse ce site ?</h2>
<p>
A tout le monde ! Si je commence à privilégier certaines personnes‚ on va m'accuser de discrimination ;o)<br />
Que vous soyez fans de fusils à pulsion plasma ou de Barbie et Ken‚ ce site est fait pour vous ! Si si !
</p>

<h2>L'auteur</h2>
<p>
L'auteur du site ? Bah‚ c'est moi‚ quelle question :–p<br />
Je vais essayer de faire le meilleur site du monde (ça doit pas être bien compliqué). Mon objectif est d'attirer un maximum de visiteurs‚ de les rendre accros à mon site‚ puis de les mettre en mon pouvoir.<br />
Je prendrai ensuite le contrôle du Monde. Une fois que ce sera fait‚ j'irai explorer les confins de l'Univers à la recherche de nouveaux peuples à soumettre à ma terrible puissance. MooUUuUuuUAhahHaaAhAAaaah !!! (rire diabolique).
</p>
<p class="anodin">
Je suis un paragraphe anodin!<br />
Je me ballade un peu partout dans les sites` et je surgis là où l'on ne m'attend pas!<br />
Pom Pom Pom!
</p>
</div>

<div id="pied_de_page">
<p>Copyright "Tout pourri Corporation" 2005‚ tous droits réservés</p>
</div>

</body>
</html>

body
{
width: 760px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
background-color: #808080;
}

#menu_left
{
float: left;
width: 200px;

}

.menu_haut
{
background-image: url("../imagesCS/menu_haut.gif");
width: 200px;
height: 42px;
background-repeat: no-repeat;
margin :0px;

}

.menu_haut p
{
text-align: center;
margin-left: 0px;
margin-top: 0px;
margin-bottom: 0px;
margin-right: 0px;
color: white;
font-size: 20px;
}

.menu_debut_st
{
background-image: url("../imagesCS/menu_debut_st.gif");
width: 200px;
height: 48px;
background-repeat: no-repeat;
margin :0px;
}

.menu_milieu
{
background-image: url("../imagesCS/menu_milieu.gif");
width: 200px;
margin :0px;
}

.menu_milieu p
{
margin : 0px;
color: red;
text-align: center;
}

.menu_fin_st
{
background-image: url("../imagesCS/menu_fin_st.gif");
width: 200px;
height: 10px;
background-repeat: no-repeat;
margin :0px;
}

.menu_bas
{
background-image: url("../imagesCS/menu_bas.gif");
width: 200px;
height: 29px;
margin :0px;
}

#corps
{
margin-left: 210px;
margin-bottom: 20px;
padding: 5px;

color: #B3B3B3;
background-color: #626262;
background-image: url("images/motif.png");
background-repeat: repeat-x;

border: 2px solid black;
}

#pied_de_page
{
padding: 5px;
margin-left : 140px;
text-align: center;

color: #B3B3B3;
background-color: #626262;
border: 2px solid black;
}

comme tu peux le voir, grâce à tes conseils, le problème des espaces entre les <div> est résolut ; ceci dit, IE continue à ne pas afficher les images de fond..

voici deux impressions d'écrans :
Firefox :

Internet Explorer :

Par contre, c'est quoi un "rendu" ?

29 juin 2006 à 12:36:46

quelqu'un sait pourquoi les images de fond de mon menu s'affichent sous Firefox, et pas sous Internet Explorer ?

30 juin 2006 à 10:57:26

Je cherche de mon côté et si je trouve, je t'en ferais part.

En attendant, cherche aussi un peu. On a le même problème alors autant se serrer les coudes

30 juin 2006 à 19:34:38

ok, merci camarade !

J'ai remarqué que quand je mettais de petites images, du style 20x30px, cela s'affichait sans problème.
Et quand je mets une image qui a la même taille que le block, elle ne s'affiche pas sous IE. Ainsi, je me demande si cela n'a pas de rapport avec le mauvais calcul des dimenssions de IE (Pour FF :largeurTotale = largeurMarge + largeurBordure + largeurPadding + largeurContenu + largeurPadding + largeurBordure + largeurMarge ; Pour IE : largeurTotale = largeurContenu).

J'ai donc augmenté la taille de mes cardes :

#menu_left
{
float: left;
width: 300px; /* 300px au lieu de 200 */

}

.menu_haut
{
background-image: url("../imagesCS/menu_haut.gif");
width: 300px; /* 300px au lieu de 200 */
height: 62px; /* 62 au lieu de 42 */
background-repeat: no-repeat;
margin :0px;

}

Mais cela ne fonctionne pas :'(

30 juin 2006 à 20:44:00

Une précision : Chez moi, seul les images de fond (background) ne s'affichent pas SAUF mon fond de la balise body !

Il faudrait que tu fasses le test chez toi de mettre une image de fond à body pour voir si ça fonctionne...

EDIT :
Est-ce que tu inclus deux ou plus de feuilles de styles dans ton fichier HTML ?

1 juillet 2006 à 14:56:09

Up

Personne n'est donc solidaire

Vostock

2 juillet 2006 à 12:06:27

Je n'ais pas tout lu mais normalement les images .png s'affichent mal sous IE. Vous n'en utilisez pas?

EDIT : Désolé je viens de vous lire correctement et j'ai compris que ce n'était pas ça le problème :euh:

Neoritos

2 juillet 2006 à 12:54:04

J'ai eu un problemme assez similaire, la solution était de ne pas utiliser par ex :

{
background-image: url("../imagesCS/menu_haut.gif");
width: 200px;
height: 42px;
background-repeat: no-repeat;
margin :0px;
}

Mais :

{
background: url("../imagesCS/menu_haut.gif") no-repeat;
width: 200px;
height: 42px;
margin :0px;
}

2 juillet 2006 à 23:18:47

C'est déjà ainsi chez moi...

Merci quand même

2 juillet 2006 à 23:21:43

Hm désolé, il se fait tard, et je suis un peu paresseux sur les horaires nocturnes ; t'aurais pas de quoi s'en rendre compte en ligne (ou un zip avec ce que tu as fait) ?
Je m'y perds un peu avec vos changements fréquents éparpillés au long du topic

3 juillet 2006 à 0:58:38

Désolé d'avoir mis autant de temps à réponde, mais je n'étais pas chez moi ce week-end.. :honte:

J'ai fait le test, et tout comme toi, l'image de fond de body s'affiche, et pas les autres.. j'ai également testé ce que Neoritos nous a conseillé, mais le résultat reste le même :'(

Sinon non, je n'ai qu'une seule feuille de style dans mon xHTML, et je n'ai inclus ni du Javascript, ni du PHP..

Je suis désolé, mais je n'ai pas mis en ligne mon site, puisqu'en fait, étant donné que je débute, je fais juste des tests afin de bien maîtriser le HTML/CSS (ce qui n’est pour l'instant pas du tout le cas

). Par contre, peut être que The Proga a déjà mis en ligne son site.. ?

Et sinon, qu'est ce que tu appelles un "ZIP" ? C'est une zone de partage de fichiers ?

3 juillet 2006 à 8:42:08

Non, ZIP comme le format de compression, donc par extension j'appelle ZIP toutes les archives compressées

3 juillet 2006 à 11:14:54

Le site n'est pas en ligne...

Alors je donne le fichier compressé en .rar

Fichier RAR

3 juillet 2006 à 13:44:14

eeeh, je vais paraître idiot, mais on fait comment pour ouvrir ton fichier ? :euh:

3 juillet 2006 à 13:56:17

Et bien, il faut utiliser WinZip ou WinRar ou encore QuickZip, ou bien ...

Il y en a plein, donc je ne vais pas tous les énumérer :lol:

Au fait, tu n'a pas l'air idiot, personne ne sait tout

3 juillet 2006 à 14:45:12

Merci !
Et bravo pour ton design, c'est très joli ! dommage qu'avec IE.... :colere2:

3 juillet 2006 à 15:31:41

J'ai regardé, j'avoue que c'est étrange. Le chargement de l'image semble être continuellement en suspens, le problème ne réside donc pas dans les CSS proprement dites.
Je ne connaissais pas ce cas.

Vos images ont été faites avec quel logiciel ?

3 juillet 2006 à 15:46:00

Mes images ont été découpées avec paint, mais pour mon cas, je ne pense pas que le problème vienne de là, puisque quand j'affiche des images plus petites découpées également avec paint, cela fonctionne sous FF et IE..

3 juillet 2006 à 18:26:04

Moi avec PhotoFiltre et Gimp.

Nienna

3 juillet 2006 à 19:43:15

Bha....IE est un navigateur qui n'est plus a jour si j'ai bien tout comprit....donc, il est normal que certaine choses ne fonctionnent pas avec lui.....na?

3 juillet 2006 à 19:53:11

ba oui mais comme la plupart des utilisateurs utilisent IE, on est bien obligés de faire en sorte que notre site soit consultable par les Windowsiens. d'autant plus que normalement, il est possible de mettre des images de fond sous IE..

Diti

4 juillet 2006 à 11:13:11

Citation : Nienna

Bha....IE est un navigateur qui n'est plus a jour si j'ai bien tout comprit....donc, il est normal que certaine choses ne fonctionnent pas avec lui.....na?

Nan, c'est pas normal.
C'est Firefox qui interprète mal les anciennes propriétés.
Tout naviguateur doit être capable d'afficher du HTML obsolète (IE, Firefox et opéra affichent correctement le HTML 3.2)
Bref, là n'est pas la question et je n'ai pas envie de créer un troll.

Pour en revenir au problème, moi quand j'ai des problèmes je tatonne en mettant des double-propriétés, une normale et une !important;
Ca pourrait fonctionner ?

Ancien validateur du SdZ.