Bug et solution pour l'inspection css dans chrome

Inspecter le css dans la console de chrome est vraiment pratique, par contre quand les sauts de lignes ne sont pas interprétés on se retrouve avec un fichier d'une seule ligne et donc c'est peu intéressant pour connaitre la ligne d'une propriété et l'éditer.

Le bug vient de l'interprétation unicode des sauts de lignes : CR / LF / NL  http://fr.wikipedia.org/wiki/Fin_de_ligne

En général les éditeurs de textes peuvent indiquer quels sont les fins de lignes des fichiers utilisés.
Par exemple dans notepad++ on peut afficher les fins de lignes.

Sur cet exemple on voit que le même fichier est d'un côté encodé avec des fins de lignes en CR et en dessous en CR LF.

Et c'est cet encodage de fin de ligne qui provoque un "bug" dans Chrome.

En effet, le fichier en CR est interprété par la console comme un fichier d'une ligne.
Et donc toutes mes propriétés se retrouvent à la ligne  1.














J'ai trouvé une première solution via Intype ! Cet éditeur ultra léger est vraiment pratique et il permet de changer l'encodage de fin de ligne des fichiers.

Et voilà le bug de la console de chrome est résolu et en plus vous utilisez désormais un éditeur de texte vraiment bien qui permet de gérer des projets !

Edit : et en fait je découvre aujourd'hui grâce à un collègue que Notepad++ sait le faire aussi ! Merveilleux :

soucis de Formulaires dans Chrome et Safari ?

Lorsqu'un designer ou un client un peu pointilleux vient vous chatouiller sur les formulaires dans chrome ou safari, avant de l'envoyer sur les roses, il y a deux petites choses

Pour supprimer l'affichage de la bordure jaune (dans chrome) ou bleue (dans safari) qui apparaît lors du focus il suffit d'ajouter en css un outline:none; sur le champ incriminé.

De la même façon Chrome (uniquement) enregistre parfois des logins et mot de passe dans le navigateur qu'il réutilise automatiquement sur des champs login et mot de passe. Sauf qu'il y ajoute un superbe fond jaune très disgracieux et qui est souvent très différent de la charte du site.
Mais grâce à un astucieux code jquery (il y a un équivalent mootools que j'ajouterais rapidement) on peut
empêcher l'affichage de ce fond.


if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0) {
$(window).load(function(){
$('input:-webkit-autofill').each(function(){
var text = $(this).val();
var name = $(this).attr('name');
$(this).after(this.outerHTML).remove();
$('input[name=' + name + ']').val(text);
});
});
}

C'est tout pour aujourd'hui.