[W3C] Affichage en vrac avec IE

Version imprimable

22/02/2009, 20h31
leoburd

[W3C] Affichage en vrac avec IE

Bonjour à tous !

Je viens de créer un site www.nitro-france.com avec l'architecture Joomla.

Sous Firefox le site est bien cadré, mais sous IE tout est en vrac.

Que puis-je faire à votre avis ?

Merci;)
22/02/2009, 22h32
blueice

Faire une feuille de style spécifique à IE
23/02/2009, 06h49
leoburd

Merci pour la réponse blueice, mais j'apprends peu à peu les CSS et le XHTML et mes connaissances ne sont pas encore suffisantes.

A quoi pourrait ressembler cette feuille de style spécifique ?
23/02/2009, 23h48
Braillane

J'ai envie de dire 3 possibilités :
1) tu utilise des hacks qui vont te permettre dans une feuille CSS de faire en sorte que certaines choses vont être interpréter par IE et pas par FF.
2) en javascript, tu détecte le navigateur (une recherche google te donnera le code ;)), et en fonction du navigateur tu inclue une feuille css différente
3) La meilleur solution, tu fais en sorte que ton code soit au norme w3C et que, sans utiliser de hacks sa marche sous les deux navigateurs... c'est pas toujours possible mais c'est le mieux

Bonne chance, et n'hésite pas a utiliser google ;)
24/02/2009, 10h04
HiRoN

Citation:

Envoyé par leoburd

A quoi pourrait ressembler cette feuille de style spécifique ?

Une petite recherche avec "commentaires conditionnels" ou "Hack CSS" devrait te donner la réponse ;)
25/02/2009, 12h23
leoburd

Panique à bord ! :oops:

Là ça nécessite des notions que je n'ai pas. :arf:

Pour contourner le problème, dois-je refaire totalement mon site en utilisant IE ?
25/02/2009, 12h48
blueice

Citation:

dois-je refaire totalement mon site en utilisant IE ?

On ne peux faire un site avec IE... :aie:
Si par la tu veux dire refaire le site uniquement pour IE, aïe aïe aïe...

Si tu ne t'y connais pas, vaut mieux trouver un template qui tourne correctement de partout.
25/02/2009, 14h12
HiRoN

Si ton site est dans l'ensemble correctement construit, tu n'auras pas grand chose à mettre dans tes commentaires conditionnels pour palier à la différence de compréhension entre les navigateurs ;)
25/02/2009, 15h44
leoburd

Merci pour vos conseils.:king:

HiRoN : comment savoir que mon site "est bien fait" ? Quels sont les critères ?
J'ai pris un template existant joomla1.5_black dans lequel j'ai rajouté 2 extensions (morpheosho et Xfade) et j'ai organisé mes modules.

Braillane : merci pour le lien. En fait je dois tout apprendre des css.:(

Blueice : J'ai chargé une démo de mon template avec IE http://demo.gelono.com/index.php?tp=...oomla1.5_black
ça fonctionne bien. Ce test est-il suffisant ?
25/02/2009, 16h02
HiRoN

Citation:

Envoyé par leoburd

HiRoN : comment savoir que mon site "est bien fait" ? Quels sont les critères ?
J'ai pris un template existant joomla1.5_black dans lequel j'ai rajouté 2 extensions (morpheosho et Xfade) et j'ai organisé mes modules.

Application des bonnes balises au bons endroits, utilisation de div pour la mise en page (et non de table), mise en page à l'aide de CSS etc.

Généralement, il est plus facile (et surtout plus rapide) de faire les commentaires conditionnels au moment du développement qu'après... :aie:

HiRoN,

Juste pour que je comprenne un peu, voici un extrait de css de mon site. Il y a bien des div ?

Code:

1
2
3
4
5
/*left and right columns*/
 
#leftcol div.module, #leftcol div.module_menu, #leftcol div.module_text, #rightcol div.module, #rightcol div.module_menu, #rightcol div.module_text, #leftcol div.moduletable_menu, #rightcol div.moduletable_menu, #leftcol div.moduletable, #rightcol div.moduletable, #leftcol div.moduletable_text, #rightcol div.moduletable_text{ border-width: 2px; 
            border-style: solid; margin-bottom: 10px; margin-top:80px;
          }

Quand aux commentaires additionnels, il est malheureusement trop tard puisque le développement du site est quasi fini :cry:

25/02/2009, 16h23
HiRoN

Citation:

Envoyé par leoburd

Juste pour que je comprenne un peu, voici un extrait de css de mon site. Il y a bien des div ?

En effet, donc il ne te restes plus qu'a reprendre ton css pas à pas (dans ton commentaire conditionnel) et tenter de le rendre compatible avec IE ;)
25/02/2009, 19h29
Braillane

Citation:

Envoyé par leoburd

comment savoir que mon site "est bien fait" ? Quels sont les critères ?

Les normes W3C, y'a que ça de vrai! Si tu respecte les normes tu évites pas mal de soucis.

Le lien vers le validateur W3C (à garder dans les marques pages!!) :
http://validator.w3.org/#validate_by_uri+with_options
26/02/2009, 19h08
leoburd

A votre avis, c'est accessible pour un débutant ?
26/02/2009, 19h55
HiRoN

Citation:

Envoyé par Braillane

Les normes W3C, y'a que ça de vrai! Si tu respecte les normes tu évites pas mal de soucis.

+1... Et je me demande encore pourquoi je n'en ai pas parlé... :aie:

Cela permet d'avoir code juste (mais pas forcément juste sémantiquement parlant) et de prendre directement les bonnes habitudes sur pas mal de points.
Le forum est là en cas de problème de compréhension (mais beaucoup d'erreurs sont très simples à résoudre). ;)
27/02/2009, 10h54
Braillane

Citation:

Envoyé par leoburd

A votre avis, c'est accessible pour un débutant ?

Oui, il suffit juste de passer ton code au validateur, il te dit tes erreurs et tu corrige, pas besoin de connaitre les normes, j'ai appris comme ça, comme la majorité des gens...
27/02/2009, 11h13
blueice

Le validateur n'est pas une solution miracle !
Tu peux faire du code valide mais dégueulasse.
Et le fait de valider son site ne corrigera pas son problème d'IE.
27/02/2009, 11h22
Braillane

Citation:

Envoyé par blueice

Le validateur n'est pas une solution miracle !
Tu peux faire du code valide mais dégueulasse.

Entièrement d'accord, mais au moins il fera du code valide...:mrgreen: c'est dja sa!

Citation:

Envoyé par blueice

Et le fait de valider son site ne corrigera pas son problème d'IE.

Sur ce coup non, mais peut etre plus tard :D
27/02/2009, 12h25
leoburd

Donc, si je comprend bien je dois apprendre XHTML et apprendre CSS pour tenter de comprendre comment apporter les bonnes modifs, c'est bien ça ?
27/02/2009, 12h39
Ethyde

Ou trouver un autres template joomla qui ne pose pas de problème et qui sois conforme et valide :)
27/02/2009, 14h34
leoburd

Ok Ethyde, mais comment savoir s'il est conforme à l'avance ?
27/02/2009, 15h34
Ethyde

Citation:

Envoyé par leoburd

Ok Ethyde, mais comment savoir s'il est conforme à l'avance ?

http://www.joomlashack.com/free-joomla-templates trouver en cherchant vite fait sur google avec les terme "template valide joomla" ou tu pourras voir dans les spécifications technique des templates si ils sont valide ou pas et les tester via la demo.
27/02/2009, 17h50
Erwan31

Citation:

Envoyé par leoburd

Ok Ethyde, mais comment savoir s'il est conforme à l'avance ?

Ces template sont dans le meilleur des cas et en général valide XHTML/CSS, c-a-d que leur code répondent aux règles d'écriture définies dans le Doctype
(la déclaration en haut du source du document y fait référence).

Si tu débutes, je te conseil de passer moi aussi par une template même si tu as la possibilité d'obtenir assez rapidement une template de basique en t'exerçant.

Sache que les correctifs pour IE (version 7 et inférieure) (via une CSS pour IE appelée avec des commentaires conditionnels) demandent une certaine expérience (voire une expertise) et une bonne connaissance des principaux bugs pour pouvoir arriver à tes fins et obtenir quelque chose de suffisamment robuste.
Si tu souhaites te former là-dessus, fais le savoir, je t'indiquerais (ou d'autres ici) quelques pistes ;)

Citation:

Envoyé par Hiron

En effet, donc il ne te restes plus qu'a reprendre ton css pas à pas (dans ton commentaire conditionnel) et tenter de le rendre compatible avec IE

Alors juste tenter :aie: Même si ça ne coûte rien d'essayer, ce genre de manipulation ne s'adresse pas vraiment à un débutant en CSS Hiron ;)
Bref il vaut mieux le prévenir avant qu'il soit pas trop dégouté :mrgreen:

Pour donner suite, voici le head de mon code source :

Si je comprend bien, mon template est valide W3C mais pas pour les CSS, c'est ça ?

Code:

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr-fr" lang="fr-fr"
dir="ltr" >
<head>
<!-- Designed by Fiona Coulter www.iswebdesign.co.uk-->
<!-- Copyright Fiona Coulter www.iswebdesign.co.uk-->
<!-- You may not remove copyright or branding information-->
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <meta name="robots" content="index, follow" />
  <meta name="keywords" content="joomla, Joomla" />
  <meta name="title" content="ARTICLE D'ACCUEIL" />
  <meta name="author" content="Administrator" />
  <meta name="description" content="Joomla! - le portail dynamique et système de gestion de contenu" />
 
  <meta name="generator" content="Joomla! 1.5 - Open Source Content Management" />
  <title>ARTICLE D'ACCUEIL</title>
  <script type="text/javascript" src="/media/system/js/mootools.js"></script>
  <script type="text/javascript" src="/media/system/js/caption.js"></script>
 
<link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="/templates/joomla1.5_black/css/template.css" type="text/css" />
<link rel="stylesheet" href="/templates/joomla1.5_black/css/color_black.css" type="text/css" />
<script type="text/javascript" language="javascript">
<!--
var colwidth=360;
var thistemplate = 'joomla1.5_black';
//-->
</script>
 
<style type="text/css">
  #maincolumn{ width: 640px;}
  #content{overflow: auto; height:45em;}</style>
<script type="text/javascript" language="javascript" src="/templates/joomla1.5_black/js/screen.js"></script>
</head>

28/02/2009, 08h05
leoburd

C'est que je ne veux pas lâcher l'affaire comme ca ! Il plaît beaucoup ce template !

Je suis allé sur Validator et voilà le résultat : j'ai 10 erreurs et 105 avertissements.

Si je comprends bien, Validator me propose une feuille de style validée CSS.

Est-ce bien fiable en général ?
Et donc, ça vaut le coup de rentrer toutes ces modifs à votre avis ?
02/03/2009, 21h28
leoburd

Je viens de reprendre à la base.

Mon template d'origine joomla1.5_black s'affiche bien d'origine sous IE.

Puis-je en conclure que c'est donc en composant mon site que j'ai créé moi-même ces désordres ? ça vous paraît logique ?
05/03/2009, 22h21
12monkeys

Bonsoir

Nous avons de très bons tutoriels ici : http://xhtml.developpez.com/cours/ http://css.developpez.com/cours/.

Le développement web, c'est comme tout : on n'apprends pas en quelques minutes, lis déjà ces tutoriels, et tu en sauras un peu plus après, pour le reste c'est la pratique qui vas faire l'expérience...
06/03/2009, 06h55
leoburd

Merci :king: