Ce site passe-t-il sous toutes les résolutions ?

Le 04/11/2011 18:18, Jean Francois Ortolo a écrit :

Tous les fichiers *.css utilisés sont ceux initiaux de Spip, sauf celui
que j'ai programmé personnellement ( complété avec les classes
personnelles du site ), qui se trouve à l'url suivante :

www.lespronostics.com/squelettes/perso.css

Je ne peux que vous dire que vu le site, le nombre de pages qu'il
contient, votre fichier CSS parait exagérément long. En le lisant on
voit des classes pour de très nombreux éléments, il faudrait donc les
repasser un par un, c'est une étude qui prendrai du temps...

Regardez ce que vous pouvez rendre générique ! Sans connaître le détail
il ne me parait pas très pertinent d'avoir cette suite de
td.<nom_classe> pour chaque page, vraiment...

Le 04/11/2011 18:32, Jean Francois Ortolo a écrit :

A mon avis ( merci de me détromper ), les font-size doivent être
spécifiés en em, et non pas en pixels ( px ).

Ce n'est nullement une obligation, vous vous en doutez.
La confusion vient du fait que px est une taille fixe, certes, mais elle
est tout de même redimensionnée si l'utilisateur souhaite grossir ou
réduire la taille du texte.
L'énorme avantage de em, ex et %, c'est qu'il suffit de modifier la
font-size du parent.

En effet, quand la définition augmente, la taille restant fixe en
pixels, occupe proportionnellement moins d'espace par rapport à l'écran.

Le problème ( c'est le cas pour les font-size, et également pour les
dimensions des containers, à part la div du milieu ), c'est que toutes
les dimensions de la partie centrale du site ( au milieu de l'écran ),
sont en pixels.

Fixer ça en em ou % ne changera rien. À moins de créer des feuilles de
styles spécifiques (ou un JS).
Attention, les % pour une fonte-size, c'est relatif à la font-size du
parent, pas à largeur !

En conclusion, il me semble que convertir toutes les tailles en
proportionnel ( sortir du tout px ), est une nécessité.

Merci de me dire ce que en pensez.

Si vous souhaitez proposer une taille différente en fonction de la
définition, oui.

Le 07/11/2011 09:55, Pierre Goiffon a écrit :

Je ne peux que vous dire que vu le site, le nombre de pages qu'il
contient, votre fichier CSS parait exagérément long. En le lisant on
voit des classes pour de très nombreux éléments, il faudrait donc les
repasser un par un, c'est une étude qui prendrai du temps...

Regardez ce que vous pouvez rendre générique ! Sans connaître le détail
il ne me parait pas très pertinent d'avoir cette suite de
td.<nom_classe> pour chaque page, vraiment...

Bonjour Monsieur

J'ai déjà dégrossi le boulot, en fixant en proportionnel, les
containers et les tailles de caractères ( en em ), pour les arrivées et
les pronostics, soit toutes les pages sauf les partants.

Les partants sont accessibles en cliquant sur le menu de gauche,
l'item "Partants".

Il reste un léger problème d'affichage ( pour les arrivées et les
pronostics ) aux faibles définitions d'écran, ce problème est du à
l'image de publicité en haut de l'écran, en dessous de la photo du haut.

Cette image de publicité, est intégrée à la partie centrale du site,
et élargit donc les dimensions en proportionnel de ce container central
<div></div> , quand la largeur de l'image est trop grande. Ceci a lieu
uniquement pour les faibles définitions d'écran ( en dessous de 1024x768
pour mon écran de 17 pouces ).

Je corrigerai celà, simplement en extrayant cette photo de publicité,
de la structure gauche-centre-droit de chaque page, de façon à ce que
l'image puisse s'étendre au dessus des blocs gauche et droit.

Quant aux partants qu'il me reste à convertir en proportionnel, ce
sera beaucoup plus facile que les reste déjà fait hier, car le nombre de
squelettes spip et de fonctions php associées, est beaucoup plus faible.

Une fois que j'aurai converti l'ensemble du site en proportionnel, je
pourrai, soit laisser le fichier perso.css tel quel ( il n'est chargé
qu'une fois par le visiteur puis laissé dans le cache du navigateur ),
soit effectivement, noter toutes les classes css de propriétés
identiques, et rassembler chaque groupes de ces classes, en une seule
classe, puis modifier les noms des classes du site, puis modifier le
site sur le serveur.

En tout cas, vous pouvez toujours tester si vous voulez, les arrivées
et les pronostics déjà en proportionnel, et me dire si l'affichage est
bien à peu près équivalent, sur toutes les définitions d'écran dont vous
disposez.

En ce qui me concerne, pour les arrivées c'est correct en 1280x1024,
1024x768 et 800x600, qui sont les seules définitions d'écran possibles
pour mon écran 17 pouces ( Je sais, je suis un miséreux... ;) ), mais
pour les pronostics, sous Firefox çà passe, mais sous Chrome, çà passe
sous 1024x768, mais je suis obligé de fixer l'affichage à 83% dans
Chrome, pour que l'affichage soit correct, en 800x600.

Je pense que ce petit problème, vient du problème ci-dessus évoqué,
de l'image de publicité, et sera entièrement résolu par mes soins, à
l'issue du processus de mise au point.

Merci beaucoup de me donner vos impressions sur ce site :
www.lespronostics.com ;)

Bien amicalement.

Jean François Ortolo

Bonsoir Monsieur

Voilà, j'ai tout mis en proportionnel, je n'ai plus qu'à attendre
l'acceptation par le Monsieur qui m'a demandé de faire le site
www.lespronostics.com , avant de simplifier beaucoup le script perso.css
, en regroupant les classes css de propriétés identiques.

Finalement, cette modification, qui me paraissait très longue à
faire, je l'ai faite en deux ou trois jours... ;)

Le script perso.css , faisait 47 pages A4 en caractères moyens/petits. ;)

J'ai d'abord éliminé les classes en trop, que j'avais mémorisées car
elles me servaient comme modèles pour celles dont je fixais les noms, en
fonction du degré d'imbrication des éléments dans les pages html.

Cette notation systématique, m'a été très utile, pour identifier les
classes en fonction de ces degrés d'imbrication.

Une question : Compte tenu fait que je met bien dans la balise
<html>, la taille par défaut suivante :

html {
font-size : 100%;
}

ainsi que dans le body, qui me sert à régler les tailles générales sur
l'ensemble du site, j'aurais besoin de savoir, si Internet Explorer, a
réellement le bug suivant : de ne pas gérer implicitement convenablement
l'héritage des tailles de caractères entre des balises <table>
imbriquées, quand ces balises <table> ne sont pas toutes, associées à
explicitement à une taille relative. ( Ceci pour les tailles en em
seulement ).

Par exemple, pour chaque table, faut-il ou non, mettre ceci par exemple :

table {
font-size : 1em;
}

dans le cas, où il y a plusieurs balises <table> imbriquées, et où
l'on veut que la taille de caractère par défaut du container externe,
soit transmise à l'intérieur de la <table> interne ?

J'ai cru voir sur Internet ce genre d'indication. Est-elle vrai ou
fausse, ou bien ma mémoire flanche un peu ?

Merci beaucoup de votre réponse.

Bien amicalement.

Jean François Ortolo

Le 07/11/2011 21:19, Jean Francois Ortolo a écrit :

Une question : Compte tenu fait que je met bien dans la balise <html>,
la taille par défaut suivante :

html {
font-size : 100%;
}

ainsi que dans le body, qui me sert à régler les tailles générales sur
l'ensemble du site, j'aurais besoin de savoir, si Internet Explorer, a
réellement le bug suivant : de ne pas gérer implicitement convenablement
l'héritage des tailles de caractères entre des balises <table>
imbriquées, quand ces balises <table> ne sont pas toutes, associées à
explicitement à une taille relative. ( Ceci pour les tailles en em
seulement ).

Par exemple, pour chaque table, faut-il ou non, mettre ceci par exemple :

table {
font-size : 1em;
}

dans le cas, où il y a plusieurs balises <table> imbriquées, et où l'on
veut que la taille de caractère par défaut du container externe, soit
transmise à l'intérieur de la <table> interne ?

J'ai cru voir sur Internet ce genre d'indication. Est-elle vrai ou
fausse, ou bien ma mémoire flanche un peu ?

Je n'en ai pas le souvenir. Voir par exemple http://haslayout.net/css/
pour les bugs IE. Et, comme l'indique d'ailleurs justement l'url de ce
site, penser à systématiquement "mettre le haslayout" (classiquement
avec un zoom: 1) lorsqu'il y a un problème sous IE < 8.

Le 08/11/2011 09:48, Olivier Masson a écrit :

Je n'en ai pas le souvenir. Voir par exemple http://haslayout.net/css/
pour les bugs IE. Et, comme l'indique d'ailleurs justement l'url de ce
site, penser à systématiquement "mettre le haslayout" (classiquement
avec un zoom: 1) lorsqu'il y a un problème sous IE < 8.

Bonjour Monsieur

Je ne sais pas ce que veut dire "mettre le hashlayout" pour une page
html.

Par "zoom: 1", vous voulez probablement dire : sous la valeur par
défaut du navigateur, de la taille des caractères ?

Je sais que les navigateur IE, ont un problème de prise en compte ou
non, des layout, mais je ne sais pas dans quelles conditions il en
tiennent compte, ou non.

Je ne sais pas, si celà a à voir, avec le mode "Quirk", ou l'autre
mode de prise en compte normale, du doctype par les navigateurs IE.

Si vous pouviez me donner une indications pour d'autres sites
traitant plus spécifiquement de la mise au point, pour les hashlayout,
des css sous IE, je vous en serais très reconnaissant. ;)

Merci beaucoup de votre réponse.

Bien amicalement.

Jean François Ortolo

Le 08/11/11 10:30, Jean Francois Ortolo a écrit :

Le 08/11/2011 09:48, Olivier Masson a écrit :

Je n'en ai pas le souvenir. Voir par exemple http://haslayout.net/css/
pour les bugs IE. Et, comme l'indique d'ailleurs justement l'url de ce
site, penser à systématiquement "mettre le haslayout" (classiquement
avec un zoom: 1) lorsqu'il y a un problème sous IE < 8.

BODY, IMG, INPUT, TABLE et TD ont toujours le "layout"

Pour le problème/questionnement à propos d'héritage (des règles propres
aux tables imbriquées), voir :
<http://www.yoyodesign.org/doc/w3c/css2/propidx.html>
... je ne sais ce que les IE en font ... :-/

Bonjour Monsieur

Je ne sais pas ce que veut dire "mettre le hashlayout" pour une page html.

non ! has layout ("a" le mode "mise en page")

oui, mais :
- avez-vous consulté l'url proposée ci-haut
- avez-vous consulté la base de données de M$ ?
- c'est un truc assez particulier à IE ...
en gros s'assurer que l'élément est bien un "calque" ou une "couche"
(des trucs à afficher)

Par "zoom: 1", vous voulez probablement dire : sous la valeur par défaut
du navigateur, de la taille des caractères ?

oui, zoom:1; est probablement le zoom par défaut
... zoom est une css propre à IE, me semble-ce
... je ne la trouve pas ici :
<http://www.yoyodesign.org/doc/w3c/css2/indexlist.html#index-z>
ni là :
<http://www.w3.org/TR/CSS21/indexlist.html#index-z>

Avec cette règle renseignée on assure le "layout" au machin

Le layout est aussi assuré si on stipule des dimensions (width ou height)
voir :
<http://msdn.microsoft.com/en-us/library/ms533776%28VS.85%29.aspx>

Je sais que les navigateur IE, ont un problème de prise en compte ou
non, des layout, mais je ne sais pas dans quelles conditions il en
tiennent compte, ou non.

voir alors chez MicroSoft, non ?

Je ne sais pas, si celà a à voir, avec le mode "Quirk", ou l'autre mode
de prise en compte normale, du doctype par les navigateurs IE.

en mode "strict" le truc du width ou height ne donnera pas le layout

Si vous pouviez me donner une indications pour d'autres sites traitant
plus spécifiquement de la mise au point, pour les hashlayout, des css
sous IE, je vous en serais très reconnaissant. ;)

et google ?
<http://www.google.com/search?q=haslayout>



--
Stéphane Moriaux avec/with iMac-intel

Bonjour Monsieur

Si j'ai bien compris, les balises table, th, td et autres tableaux,
ont le layout par défaut.

Et puis, pour que les autre élément de type bloc tels que div ou p
aient le layout, il suffit de leur affecter un width, même en pourcentage ?

Faut-il obligatoirement, pour les div, spécifier un height , et si
oui, laquelle ?

Actuellement, tous les éléments du site www.lespronostics.com , sont
des tables ou des p ou des div, mais les dic ont toujours une width.

Celà est-il suffisant, pour que tous les éléments aient le layout ?

Je suis sous Linux Fedora 14 64 bits.

Merci beaucoup de votre réponse.

Jean François Ortolo


Le 08/11/2011 12:08, SAM a écrit :

Le 08/11/11 10:30, Jean Francois Ortolo a écrit :

Le 08/11/2011 09:48, Olivier Masson a écrit :

Je n'en ai pas le souvenir. Voir par exemple http://haslayout.net/css/
pour les bugs IE. Et, comme l'indique d'ailleurs justement l'url de ce
site, penser à systématiquement "mettre le haslayout" (classiquement
avec un zoom: 1) lorsqu'il y a un problème sous IE < 8.

BODY, IMG, INPUT, TABLE et TD ont toujours le "layout"

Pour le problème/questionnement à propos d'héritage (des règles propres
aux tables imbriquées), voir :
<http://www.yoyodesign.org/doc/w3c/css2/propidx.html>
... je ne sais ce que les IE en font ... :-/

Bonjour Monsieur

Je ne sais pas ce que veut dire "mettre le hashlayout" pour une page
html.

non ! has layout ("a" le mode "mise en page")

oui, mais :
- avez-vous consulté l'url proposée ci-haut
- avez-vous consulté la base de données de M$ ?
- c'est un truc assez particulier à IE ...
en gros s'assurer que l'élément est bien un "calque" ou une "couche"
(des trucs à afficher)

Par "zoom: 1", vous voulez probablement dire : sous la valeur par défaut
du navigateur, de la taille des caractères ?

oui, zoom:1; est probablement le zoom par défaut
... zoom est une css propre à IE, me semble-ce
... je ne la trouve pas ici :
<http://www.yoyodesign.org/doc/w3c/css2/indexlist.html#index-z>
ni là :
<http://www.w3.org/TR/CSS21/indexlist.html#index-z>

Avec cette règle renseignée on assure le "layout" au machin

Le layout est aussi assuré si on stipule des dimensions (width ou height)
voir :
<http://msdn.microsoft.com/en-us/library/ms533776%28VS.85%29.aspx>

Je sais que les navigateur IE, ont un problème de prise en compte ou
non, des layout, mais je ne sais pas dans quelles conditions il en
tiennent compte, ou non.

voir alors chez MicroSoft, non ?

Je ne sais pas, si celà a à voir, avec le mode "Quirk", ou l'autre mode
de prise en compte normale, du doctype par les navigateurs IE.

en mode "strict" le truc du width ou height ne donnera pas le layout

Si vous pouviez me donner une indications pour d'autres sites traitant
plus spécifiquement de la mise au point, pour les hashlayout, des css
sous IE, je vous en serais très reconnaissant. ;)

et google ?
<http://www.google.com/search?q=haslayout>

Le 08/11/2011 13:47, Jean Francois Ortolo a écrit :

Bonjour Monsieur

Si j'ai bien compris, les balises table, th, td et autres tableaux, ont
le layout par défaut.

Oui, <table>, <td>, <body>, <img>, <hr>, <input>, <select>, <textarea>,
<button>, <iframe>, <embed>, <object>, <applet> et <marquee> sont censés
avoir le layout.
Mais ça ne coute rien de le forcer pour tester.

Et puis, pour que les autre élément de type bloc tels que div ou p aient
le layout, il suffit de leur affecter un width, même en pourcentage ?

Faut-il obligatoirement, pour les div, spécifier un height , et si oui,
laquelle ?

Comme je l'ai dit, on utilise très couramment zoom: 1 pour la simple et
bonne raison que cette propriété ne change rien à la mise en page.
Quelques autres propriétés donne le layout mais ne sont utilisables
systématiquement.

Actuellement, tous les éléments du site www.lespronostics.com , sont des
tables ou des p ou des div, mais les dic ont toujours une width.

Celà est-il suffisant, pour que tous les éléments aient le layout ?

Il n'est pas nécessaire que *tous* les éléments aient le layout : juste
ceux qui posent problème.

Je suis sous Linux Fedora 14 64 bits.

IE tourne bien sous Wine. Et probablement même IE Tester.

Le 08/11/2011 14:24, Olivier Masson a écrit :

Et puis, pour que les autre élément de type bloc tels que div ou p aient
le layout, il suffit de leur affecter un width, même en pourcentage ?

Faut-il obligatoirement, pour les div, spécifier un height , et si oui,
laquelle ?

Comme je l'ai dit, on utilise très couramment zoom: 1 pour la simple et
bonne raison que cette propriété ne change rien à la mise en page.
Quelques autres propriétés donne le layout mais ne sont utilisables
systématiquement.

Bonjour Monsieur

Si j'ai bien compris, on met dans la classe css de l'élément que l'on
veut avoir le layout, ceci ( par exemple pour un div ) :

/* classes gauche pour un div */
div.gauche {
zoom: 1;
}

La réponse à cette question, me permettra peut-être, de satisfaire
entièrement le Monsieur qui m'a demandé de faire ce site :
www.lespronostics.com

Il est en train de faire des essais, parfois il me dit que les
tailles des caractères sont trop petites, parfois trop grandes. ;(

Je ne sais pas si son navigateur est Firefox ou Internet Explorer.

Merci beaucoup beaucoup pour pour votre réponse.

Jean François Ortolo