Aujourd’hui un client m’a demandé comment rajouter un sous domaine chez gandi. Pas de problème, j’en profite pour en créer un aussi pour mon prochain billet.

1. se connecter
2. cliquer sur l’onglet « Administration »
3. cliquer sur le nom de domaine choisi
4. en bas de la page, dans les « Paramètres techniques », il faut choisir « Gérer les zones »
5. choisir « Ajouter un enregistrement » en bas de la page
6. Type: A ou CNAME
7. Nom: sous domaine à créer
8. Valeur: adresse IP (type A) ou nom réel de la machine (type CNAME)

La page « Gérer les zones » est mis à jour.

Mais une heure plus tard le nouvel enregistrement à disparu. Tiens, un fantôme dans la machine…
Je recommence la même série de manipulation et je cherche ce que j’ai pu raté.
En fait la constatation finale n’est qu’une étape car un bouton est apparu en haut de la page, à l’opposé des autres boutons. Très bien intégré dans la charte il passe inaperçu au premier coup d’œil. Le bouton dit « Valider les changements ».

Outre le fait que lors de l’ajout du nouvel enregistrement rien ne disait explicitement qu’il était temporaire, le fait que ce bouton apparaisse en haut et soit noyé dans la charte alors que les autres boutons sont en bas de la page est un bon exemple de ce qu’il ne faut pas faire : seule une personne connaissant déjà cette interface va remarquer cette nouvelle zone ou des boutons sont apparus comme par magie. Dans un cas pareil il faudrait avoir un décrochement de la charte graphique pour mettre en avant ces nouveaux boutons et mettre en avant leur importance pour la suite des opérations.

Pour l’instant, nos attendons notre sous-domaine pour tester un nouveau site en conditions réelles.
C’est long d’attendre…

Today I loose my day on a specific IE7 bug:
it doesn’t take in account fixed height and overflow in table structure.

The concept is to use the thead tag (the tfoot tag if needed) for the fixed part and the tbody tag for the scrolling part:

<table>
  <thead>
  </thead>
  <tbody>
  </tbody>
</table>

With firefox 2 you just need this CSS code:

table>tbody {
  overflow: auto;
  height: 280px;
  overflow-x: hidden;
}

Simplicty, efficacity.

With IE7 you need to cheat and to add an extra div tag which support the overfllow rule. The div tag height must large enough to contain the table: thead height + tbody forced height.

<div class="tableContainer">
  <table>
    <thead>
    </thead>
    <tbody>
    </tbody>
  </table>
</div>

The CSS rules are now more complex:

div.tableContainer {
  width: 90%;       /* table width will be 99% of this*/
  height: 320px;    /* must be greater than tbody*/
  overflow: auto;
  margin: 0 auto;
}

table {
  width: 97%;  /*100% of container produces horiz. scroll in Mozilla*/
  border: none;
  border-spacing: 0px;
  background-color: transparent;
}

table>tbody {
  overflow: auto;
  height: 280px;
  overflow-x: hidden;
}

With that code every tr tag height is set to 280px on IE7, we need an extra rule:

table>tbody tr {
  height: auto;
}

But the thead is always glue with the tbody. We need to make it relative:

table>thead tr {
  position:relative;
  top: 0px;/*expression(offsetParent.scrollTop); IE5+ only*/
}

This is the fifth implementation of the day to fix this bug. I don’t know how to thanks Microsoft to make me earn money on customers. With Internet Explorer I don’t need to buy a Wii the improve my mind.