Incompabilité Firefox Linux et Windows

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
Répondre
Hoaxyde
Lézard à collerette
Messages : 207
Inscription : 27 févr. 2004, 21:24

Incompabilité Firefox Linux et Windows

Message par Hoaxyde »

Salut,

je me fais un blog sous DotClear. Il y a un calendrier affiché. Sous Linux et Firefox, voilà le résultat, celui que j'attends :
Image

Seulement sous IE et sous Firefox Windows, je voie ça :
Image
... (le calendrier prend plus de place qu'il ne lui en est accordé)
Visiblement, l'espace entre les caractères est plus grand sous Windauze...

Le code rendu de mon caldendrier est ça (remis en page pour une meilleure lisibilité) :

Code : Tout sélectionner

<div class="cal">
<table summary="calendrier">
<caption>Mai 2004</caption>
<thead><tr><th scope="col">
<abbr title="Lundi">Lun</abbr></th>
<th scope="col"><abbr title="Mardi">Mar</abbr></th>
<th scope="col"><abbr title="Mercredi">Mer</abbr></th>
<th scope="col"><abbr title="Jeudi">Jeu</abbr></th>
<th scope="col"><abbr title="Vendredi">Ven</abbr></th>
<th scope="col"><abbr title="Samedi">Sam</abbr></th>
<th scope="col"><abbr title="Dimanche">Dim</abbr></th>
</tr></thead><tbody>
<tr><td> </td><td> </td><td> </td><td> </td><td> </td>
<td>1</td>
<td>2</td>
</tr><tr>
<td>3</td>
<td><a href="/blog/index.php?2004/05/04">4</a></td>
<td><a href="/blog/index.php?2004/05/05">5</a></td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
</tr><tr>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
</tr><tr>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
<td>22</td>
<td>23</td>
</tr><tr>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
<td>30</td>
</tr><tr>
<td>31</td>
<td> </td><td> </td><td> </td><td> </td><td> </td><td> </td></tr>
</tbody></table></div>
Et le CSS est ça :

Code : Tout sélectionner

.cal {
}

.cal table {
	border-collapse : collapse;
	font-size : 0.85em;
	margin-left:-7px;
	border: 1px solid;
	width:97%;
	margin-right:-2px
}

.cal caption {
	padding : 0 0 0.3em 0;
	font-size : 1.2em;
}

.cal abbr {
	border : none;
	font-size:10px;
	margin-left:-2px;
}

.cal th, .cal td {
	border : none;
	padding : 1px;
}
.cal td {
	text-align : center;
}

.cal td.active {
	border : 1px solid #0373A1;
}
.cal td.active a {
	font-weight : bold;
}

.cal a {
	font-weight : bold;
}
Que faire pour que ça marche sous Windauze ?
Pour que les espaces entre les lettres soient les mêmes que sous Nux ?

Merci bcp ;)

++
Hoaxyde :lol:

Dessin de l'avatar par L.L. de Mars . Colorisation, arrangements et tout le reste par moi...
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Ça pourrait venir de la police utilisée qui a une taille différente sous Linux et Windose ?
Hoaxyde
Lézard à collerette
Messages : 207
Inscription : 27 févr. 2004, 21:24

Message par Hoaxyde »

Les deux screen sont à 100%, dont on doit pouvoir le voir si c'est le cas... Mais de toute façon, je la spécifie la taille de la police, non ?
Hoaxyde :lol:

Dessin de l'avatar par L.L. de Mars . Colorisation, arrangements et tout le reste par moi...
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

J'ai déjà entendu parler de tailles de pixel différentes entre mac et pc, alors... :?
Hoaxyde
Lézard à collerette
Messages : 207
Inscription : 27 févr. 2004, 21:24

Message par Hoaxyde »

Seulement il n'est en aucun cas question de Mac, mais bien de PC Linux et de PC windows :? :wink:

++ :wink:
Hoaxyde :lol:

Dessin de l'avatar par L.L. de Mars . Colorisation, arrangements et tout le reste par moi...
Benoit
Administrateur
Messages : 4894
Inscription : 19 juil. 2003, 10:59

Message par Benoit »

La taille de police que tu spécifies c'est (à ma connaissance) sa hauteur, mais si tu regardes deux polices différentes, tu verras bien que les lettres n'ont pas la même largeur. Or tu as clairement deux polices différentes utilisées entre tes deux captures d'écran.

Même si c'était la même, et que tu précisais la même taille, n'oublie pas que les gens peuvent encore choisir une résolution d'écran différente dans leurs options. Je sais que Windows est en général à 96dpi contre 72dpi pour les Mac, qu'en est-il de Linux ?

Bref, je pense que tu devrais donner un peu plus d'air à ton tableau, et voir s'il n'est pas déjà coincé dans une zone de largeur fixe en px au lieu d'unités variables comme les em. Et vérifier que quand tu changes la taille des caractères avec le menu Affichage ou Ctrl+molette de la souris tu n'as pas déjà des débordements sous Linux.
Hoaxyde
Lézard à collerette
Messages : 207
Inscription : 27 févr. 2004, 21:24

Message par Hoaxyde »

Benoit a écrit :La taille de police que tu spécifies c'est (à ma connaissance) sa hauteur, mais si tu regardes deux polices différentes, tu verras bien que les lettres n'ont pas la même largeur. Or tu as clairement deux polices différentes utilisées entre tes deux captures d'écran.

Même si c'était la même, et que tu précisais la même taille, n'oublie pas que les gens peuvent encore choisir une résolution d'écran différente dans leurs options. Je sais que Windows est en général à 96dpi contre 72dpi pour les Mac, qu'en est-il de Linux ?

Bref, je pense que tu devrais donner un peu plus d'air à ton tableau, et voir s'il n'est pas déjà coincé dans une zone de largeur fixe en px au lieu d'unités variables comme les em. Et vérifier que quand tu changes la taille des caractères avec le menu Affichage ou Ctrl+molette de la souris tu n'as pas déjà des débordements sous Linux.
Donner un peu plus d'air ? Gné ?
Si, il est "coincé" dans une zone de largeur fixe...
Et j'ai des débordements quand je change la taille... Mais pas quand elle n'est pas changée. Ors mon but c'est de ne pas en avoir quand la taille n'et pas changée.

Donc, en CSS, il n'y a pas d'attributs pour définir l'espace entre les caractères ?

Merci ;)
++
Hoaxyde :lol:

Dessin de l'avatar par L.L. de Mars . Colorisation, arrangements et tout le reste par moi...
chBok
Iguane
Messages : 991
Inscription : 17 oct. 2003, 19:17

Message par chBok »

Hoaxyde a écrit :Donc, en CSS, il n'y a pas d'attributs pour définir l'espace entre les caractères ?
Ben si, il y aurait letter-spacing mais est ce vraiment une solution ?
Benoit
Administrateur
Messages : 4894
Inscription : 19 juil. 2003, 10:59

Message par Benoit »

Hoaxyde a écrit :Or mon but c'est de ne pas en avoir quand la taille n'et pas changée.
Ça ne veut rien dire ça que la taille n'est pas changée, changée par rapport à quoi ? Ce qu'on essaie de t'expliquer c'est qu'elle sera déjà différente au départ d'une machine à l'autre en fonction des polices installées et de la résolution d'affichage. Tu ne dois donc pas spécifier une zone de largeur fixe mais une zone qui s'adapte à la taille (réelle) de la police, en em ou en ex.
Hoaxyde
Lézard à collerette
Messages : 207
Inscription : 27 févr. 2004, 21:24

Message par Hoaxyde »

Bin je peux pas :oops: ...
Et tu le vois bien sur la capture, les polices sont les mêmes, ce sont juste les distances entre elles qui diffèrent, non ?

++ :wink:
Hoaxyde :lol:

Dessin de l'avatar par L.L. de Mars . Colorisation, arrangements et tout le reste par moi...
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Ben si tu peux en donnant des tailles relatives...
Et puis avec width:97%; que fais-tu des 3% restants (du coup je m'interroge sur FF pour Linux, il a un bug ?)
Hoaxyde
Lézard à collerette
Messages : 207
Inscription : 27 févr. 2004, 21:24

Message par Hoaxyde »

Ben oui, mais je dois refaire toutes ma css alors....
Et pixels ---> em, je sais pas comment faire :cry:

Pour le width: 97%, ben c'est ça, ou ça rentrait pas. et si firefox linux à un bug, le windows, qu'est ce que ça doit être, vu qu'avec 97%, ça rentre même pas :!: :lol:

Merci ;)

++
Hoaxyde :lol:

Dessin de l'avatar par L.L. de Mars . Colorisation, arrangements et tout le reste par moi...
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Hoaxyde a écrit :Et pixels ---> em, je sais pas comment faire :cry:
Pas toute, juste ce morceau là :wink:
Avec une fonte moyenne, 1em =~12-13 px

Ensuite ce sera plus facile, par exemple la largeur devra être environ de 7em :wink:
Bobe
Iguane
Messages : 742
Inscription : 28 juil. 2003, 21:29

Message par Bobe »

calimo a écrit : Avec une fonte moyenne, 1em =~12-13 px
:roll:

em est une unité relative.
http://www.yoyodesign.org/doc/w3c/css2/ ... ngth-units
« La vie d’un geek est un combat perpétuel contre l’imperfection »
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Je disais ça juste pour donner une idée :roll:
Mais en effet ça dépend de la taille de l'élément parent :wink:
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 3 invités