Problème de mise en page, d'un navigateur à l'autre

(reprise du message précédent)

Il y avait une 20ène d'erreur du à la balise marque que j'ai utilisé en attendant de mettre au point un script javascript (toujours pas effectué lol)

En l'enlevant, je n'ai plus d'erreur

Niveau html, je ne dirais pas que je suis un dieu, mais je m'y connais, en CSS un peu moins par contre (d'ou mon poste sur CE forum)

Pourquoi un liste de définition (incomplète) pour encadrer ton menu ?
Ta page comporte encore une dizaine d'erreurs, dont celle ci-dessus.

Sinon, pourquoi ne pas t'inspirer de
ce gabarit ?

je suppose que pour IE il faut preciser une hauteur dans #gauche et #droit pour le forcer a appliquer l' overflow

Véro -> ma page comporte des erreurs dites "minimes" pour moi, étant donné que se sont des erreurs du à des fautes de frappes, ou d'oublie, comme l'utilisation de <br /> ou autre.

Pour la gabarit, tout simplement parce que la page ici, ne s'adapte pas à la fenêtre en height, chose que je voulais

Jp94 -> Dsl de m'être emporté, mais j'ai "assez" mal pris ton ancien message, étant donné, que j'avais souligné que le site été en cours de création, et que par conséquent, je le travaillais en même temps que vous regardiez. Je code avec notepad++, j'ai pas d'interface HTML, et j'ai un serveur php des temps anciens (pas pour easy php), donc les erreurs de w3c, je ne les vois pas systématiquement.

Pour mes pages, j'ai déja essayé, mais le résultat été impecable sous IE, mais plus sur Firefox (la page s'arrêtait au milieu de la fenêtre)

Expliquer les dfférence entre FF et IE me semble impossible, d'une, elle sont trop nombreuses, et de deux, je ne les connais pas toutes, loin de la.
Quoiqu'il en soit, un conseil qui revient souvent, faire un commentaire conditionnel et ainsi créer une page spécifique pour IE.

Ainsi, tu pourras :

-faire un CSS conforme aux normes W3C qui pourra te permettre d'apprendre le CSS correctement (il ne faut pas "apprendre" avec de mauvaise base ^^ )
-faire un CSS "bidouille" pour permettre un affichage correct sous IE (tout en retant au maximum valide).
-conserver une feuille valide et ainsi pouvoir "bidouiller" librement pour la CSS d'IE.

Le commentaire conditionnel (evite l'emploi de hack tel qu'"!important") :

    <!--[if lte  IE 6]>
     <link rel="stylesheet" type="text/css" href="css/ie.css">
    <![endif]-->

Aprés, j'ai pas le temps de vraiment regarder a ton code pour le moment (en plus, il y a des personnes bien plus compétente sur ce forum).

Bonne chance.

P.S. : J'ai été trés bien accueilli aussi.

N.B. : Un bon CSS nécéssite un bon HTML (voir XHTML), donc même minime, il est préférable de les corriger avant de faire la mise en page CSS. Aprés, il peut toujours y avoir des modifications.
Modifié par TheReverendEVIL (18 Apr 2006 - 11:23)

Mais lol, mon code est valide à la norme HTML boudiou! C'est juste que y'en a qui regarde au mauvais moment

Ce commentaire, je le met ou ? Comment dois-je procéder ? Dans le même fichier Css ? en faire deux ? J'ai compris le principe, mais pas le fonctionnement
Modifié par yoshimitsu (18 Apr 2006 - 11:27)

yoshimitsu a écrit :
Véro -> ma page comporte des erreurs dites "minimes" pour moi, étant donné que se sont des erreurs du à des fautes de frappes, ou d'oublie, comme l'utilisation de <br /> ou autre.

Pour mes pages, j'ai déja essayé, mais le résultat été impecable sous IE, mais plus sur Firefox (la page s'arrêtait au milieu de la fenêtre)

Tu as lu l'article que je t'ai mis en lien concernant la validation ?
Que veux dire : une erreur minime ?

Un erreur "minime" peut faire en sorte que ta page ne s'affiche plus ...

Comment repères-tu tes erreurs, d'ailleurs ?
Il en reste
trois

dont celle que je t'ai mentionnée : à savoir l'utilisation d'une balise dl pour encadrer ton menu.

Ensuite, il y a possibilité d'adapter le gabarit proposé à la fenêtre en hauteur. Au moins tu aurais une structure cohérente.
En effet, l'ordre d'apparition des tes conteneurs n'est pas logique, non seulement sur le plan accessible (déroutant pour une lecture vocale) mais il est sûrement la cause de tes soucis css.

Pourquoi des overflow: auto; partout ?
Avec quoi il float, le div news ... tout le reste ou presque est en position absolute ?

On a l'impression que tu rajoutes des styles et des balises pour essayer de résoudre le problème ... au lieu de le comprendre (à l'aide des exemples qui te sont donnés)

Je t'assure que ton code est incompréhensible.

Enfin, si tu modifies trop souvent la page que tu laisses en lien dans ce topic, cela risque de le rendre inexploitable, non ?

Regarde, je répond 1 minutes aprés toi, et il en reste 2

De plus, ces erreurs sont dù à la pub de mon hébergeur

Et les overflow partout, sont ici, parce que quand je rétrécis ma fenêtre, la div ne s'affiche pas correctement, et je me trouve avec une bande blanche.

Et la div news float avec la div contenu, car j'utilise un script php pour appeler une page dans une autre. Si tu as une autre idée, de comment faire, je veux bien, moi c'est la seule solution que j'ai trouvé à ce jour
Modifié par yoshimitsu (18 Apr 2006 - 11:35)

yoshimitsu a écrit :
Mais lol, mon code est valide à la norme HTML boudiou! C'est juste que y'en a qui regarde au mauvais moment

Ce commentaire, je le met ou ? Comment dois-je procéder ? Dans le même fichier Css ? en faire deux ? J'ai compris le principe, mais pas le fonctionnement

Le commentaire, tu le met dans le head (en fait, c'est un commentaire qui dit :

"Si l'utilisateur utilise une IE 6 ou une version précédente, utiliser la feuille de style suivante : ..."

Donc, tu mets ton "link" habituel, vers la page CSS aux normes, et tu mets le commentaire conditionnel a la suite.

Ensuite, tu fais "deux" feuilles de styles, une contenant le code correct, et une autre, qui contient les morceaux de codes CSS pour IE (tu n'es pas obliger de reprendre toute la feuille de style).

Ok je vais essayer cela, je termine ma page avant, je vois avec véro sur le rangement "possible" de mon code, et je test ton idée

Merci beaucoup

TheReverendEVIL a écrit :

Ensuite, tu fais "deux" feuilles de styles, une contenant le code correct, et une autre, qui contient les morceaux de codes CSS pour IE (tu n'es pas obliger de reprendre toute la feuille de style).

Oui, mais d'abord il faut avoir un code correct (html ET css !) et avoir identifié le problème comme venant bien d'un défaut d'IE !

Bon, alors, dîtes moi ou sont mes erreurs, dîtes moi ou je me suis mal organisé, parce que la, vous me dites que mon code est mal rangé, mais, ça m'aide pas, car pour moi, il l'est, bien rangé.

Conforme aux normes HTML, et CSS, les 2 erreurs javascript sont des erreurs lié à l'insertion de la pub par mon hébergeur

Les erreurs, que vous pourrez "éventuellement" aperçevoir, sont des erreurs de frappes, ou autres, étant donné que je ne code qu'avec notepad++, il m'arrive de temps à autre d'oublier quelques trucs, mais rien de bien grave...

Effectivement, ma CSS est peux être bidon mais dîtes moi ou, et quoi faire. J'en veux pas de vos gabarit je ne veux que, a peu prés, celui-ci, sauf que moi, j'ai mis bottom=0, pour les divs de gauche et de droite, sinon...
Modifié par yoshimitsu (18 Apr 2006 - 12:24)

Bonjour,

Pour le moment le DOCTYPE que tu utilises est incomplet. Cette version:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Fait que les navigateurs sont en "mode de compatibilité" et non en "mode respect des standards". Concrètement cela implique que chaque navigateur graphique interprète ton code comme bon lui semble, en particulier en utilisant le modèle de boîte non standard de Microsoft.

Il serait préférable d'utiliser le même mais complet qui fera passer IE 6 en mode standard:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

On pourra ainsi espérer un comportement similaire entre les IE6, Gecko, Safari etc.

Ensuite quelques soucis de conception dans l'utilisation des niveaux de titres.

Le premier niveau de titre rencontré est un h2. Il manque un h1 qui constitue un titre de premier niveau et devrait être présent en premier.
L'enchaînement des titres est donc à revoir pour respecter la cohérence et l'enchainement des titres.

A mon avis les overflow sont assez pénibles à la navigation. Dans ma résolution actuelle (800x600) j'en compte 6 . Pourquoi vouloir tout cadrer sur une hauteur écran. Le web n'est pas un média paginé, autant laisser le contenu s'épancher librement et ne pas surcharger les dispositifs pour que l'utilisateur accède à ton contenu.

Je serais d'avis de simplifier également ton menu dont le dl n'apporte pas grand chose:

<h2>Curriculum vitae :</h2>
<ul>
<li><a href="index.php?page=formation">~Formation~</a></li>
etc.
</ul>
<h2>Projet :</li>
<li><a href="index.php?page=formation">~Formation~</a></li>
etc.
</ul>

Désolé, je dois m'arrêter je reprendrais plus tard.

Merci pour ta réponse

Donc, pour le doctype, je suis confus, c'est un mauvais copié collé ^^', que je viens de rectifier et t'en remercie. (erreur que je n'aurais même pas penser à reregarder)

Pour les overflow ? Comment est-ce possible, j'ai discuté par MP avec véro, et je les ai tous retirés y'a deux heures de cela (vers 13h) il en reste que deux, le menu, car sous IE, il est plus large (pourquoi ? Je ne sais pas) et le contenu (normal)

Pour les éléments de structuration du document, il y a bien un H1 ne t'inquiète pas, c'est parce que j'utilise un script php, et non une frame

Je viens de comprendre pour le menu ainsi que le reste

Tu as du prendre le source bien avant de rédiger ton message, toutes ces erreurs ont été changé, j'ai essayé d'inclure un flash dans ma liste ordonnée, d'ou l'insertion des balises "li" et "ul"

Qui n'y sont plus actuellement

Je regarde pour le doctype la, faute que je n'avais pas remarqué, ainsi que les éléments de structuration de mon document (mais je pense que c'est ok)

Merci

Voila, le doctype est changé,

Et j'utilise bien h1 avant d'utiliser h2

Niveau HTML je pense pas qu'il y ai un quelconque soucis, maintenant, je pense que c'est sur ma CSS qu'il faille se pencher

Pendant ce temps j'ai codé les 4 premiers liens de mon menu, maintenant, je m'occupe de l'interface graphique, donc je serais un peu moins disponible (je répondrais pas au bout de quelques minutes )

Je pourrai avoir la suite Igor si tu as le temps ?

Merci d'avance

je t'avais dit de fixer une hauteur pour Ie de maniere a lui faire appliquer les overflow .
Si pour FF ca ne fonctionne pas tu laisse ta feuille tel quelle et dans le head de ton html tu ajoutes

<!--[if IE]>
<style type="text/css">
#gauche{height:YY px;}
#droit {height:YYpx;}
</style>
<![endif]-->

remplace les YY par les valeurs adequates