28234 sujets

CSS et mise en forme, CSS3

Problème avec CSS

Bonjour à tous,

Lien : http://www.deglingue.com/essai/index.html
Voilà mon problème (ou mes problèmes):

- sous ie : chargement de la page css trop long, les background mettent une heure à se charger, pire encore les boutons chargés dans la page css (rollover) sont misérables car il disparaisse le temps (trop long) que l'image survolé apparaisse.

- sous firefox : le menu n'apparait carrément pas

- dans l'ensemble : problème de lenteur général et chose que je ne comprend pas, pourquoi une fois la page css chargée en page principal faut il qu'elle se recharge à chaque changement de page. Car du coup il faut attendre que les background les boutons... se chargent.

Je suis loin d'être confirmé en création de site merci d'être le plus clair possible dans vos réponses

Merci d'avance
Salut, bienvenue à toi, si tu veux tu peux aller te présenter dans le bar du forum http://forum.alsacreations.com/forum.php?action=t&fid=9

Pour le roll over, la technique du roll over avec image unique est la solution :
http://www.elmoustikoblog.net/tutoriels/css/roll_over/

Pour le chargement long, ce n'est pas la feuille de style qui met du temps à se charger mais les images, à voir les images utilisées, ça parait normal
header : 40ko
menu : 10ko
chacun des menu : 3 ko
contenu : 20ko

C'est trop, les styles CSS ne sont pas en cause ici.
Merci de ta réponse rapide
Je viendrai me présenter demain car je bosse du matin cet semaine mais je le ferai (promis) car le css me branche vraiment et ce forum a l'air de beaucoup et bien en parler.

Par rapport à ta réponse :

- Je suis d'accord avec toi d'après tes remarques pour ie.. quel taille de fichier est conseillé ? (header, menu, chaque menu et contenu) pour que je me fixe un objectif.

- Par contre sous firefox crois tu que le css soit réellement hors de cause car le menu invisible ca me parait bizar quand même.

Merci
Je pencherais plutôt du côté du code HMTL (j'ai pas regardé les CSS), parcequ'il est pas des plus chouette (le prend pas mal Smiley cligne ).

Pour le poids des images, en fait, le "problème" c'est que tu n'utilises pas avantageusement les images, le mieux c'est d'utiliser des images facilement répétable horizontalement et verticalement pour économiser le poids des images.

Perso, je dépasse rarement les 40ko pour l'ensemble des images d'une page, le header en prenant la plus grosse partie.

Si tu veux, je peux te conseiller la lecture d'un article de Studio Multimedia du numéro de janvier sur la mise en page d'un design grâce aux CSS qui fait un peu le tour de la question, en partant de la découpe du design à la structure HTML et au code CSS
http://forum.alsacreations.com/topic.php?fid=9&tid=1077

Pour les présentations, c'est pas obligatoire, c'est juste si tu veux Smiley cligne c'est plus sympa ! mais rien ne presse Smiley lol
En fait si sous FireFox le menu ne s'affiche pas c'est peut-être parce que tu n'as rien écrit entre les balises <a href="jeux.html" class="bouton7"></a>

Si tu écrits quelque chose, cela s'affichera avec le background sur la largeur et la hauteur de ton texte.
Merci ElMoustiko je vais essayer de réduire (peut être changer) pour réduire un maximum la taille des images.. il est vrai que je répète pas beaucoup les images vu quelles sont toutes unique à chaque rubrique.. enfin je vais y travailler.. cela résoudrai donc mon problème pour ie..

Nadya => si il n'y a rien entre ces balises, c'est justement parce que ce sont des images qui se trouvent dans ma feuille de style.. le texte de l'image étant incorporé à l'image je n'ai rien à écrire là mais juste à y faire apparaître mes images depuis la css..

c'est justement là qu'il doit y avoir un problème dans ma css (qui comme le dis ElMoustiko n'est pas des plus chouette c'est juste mais je débute).. Sous firefox il doit y avoir une histoire de taille d'image (différente sous ie puisque le respect des normes est différente), mais le problème c'est que je ne m'y connait vraiment pas assez pour trouver la réponse donc si quelqu'un à une idée ou la solution.... Smiley langue
les pros de firefox je vous écoute volontiers !

Merci
Modifié le 04 Jan 2005 - 14:33
Remoi,

http://www.deglingue.com/essai/index.html

ca y'est ca marche sous ie et firefox.. j'ai fini par trouver coup de chance parce que j'allais laisser tomber.. en fait dans ma css au chargement d'image il fallait rajouter pour chaque bouton le
display: block;

maintenant que ca marche (et dites moi si chez vous aussi ca marche => ie et firefox) vous remarquerez que ca bug légèrement par moment quand on passe la souris rapidement desfois sur les boutons.. J'ai déjà réduit la taille de mes boutons et des mes fichiers images pour en arrivé à 55ko au total.. Mais peut être que j'ai mal écris un code ou qu'il y a des choses qui pourrait faire que ca marche encore mieux.

Je suis déjà très content d'avoir résolu ce premier problème ;D
Merci
[quasi HS]Tu pourrais mettre un titre un peu plus évocateur que "Problème avec CSS"? Quelque chose comme "lenteur de chargement" ou autre chose qui t'inspire. C'est utile pour de futures recherches.[/HS]

Merci d'avance,

@+, HoPHP
Modifié le 05 Jan 2005 - 19:37
Comme ca sous ie c'est bien ?

http://www.deglingue.com/essai/index.html

Et regarde sous firefox le truc que ca fait => Smiley biggol

Je me suis inspiré de ton exemple et j'ai crée deux images.. sous ie c'est bien mais sous firefox c'est horrible le résultat.. tu vois peut etre ce que j'ai fait comme erreur..

Encore une fois je m'aperçois de la grande différence entre ie et mozilla
Modifié le 05 Jan 2005 - 19:54
Sujet clos
Aller à