css

  • Tous les éditeurs de code que j’ai utilisé

    Ceci est un post que j’ai eu envie d’écrire pour aucune autre raison que celle d’être tombé sur l’un des premiers article du blog de Paweł Gryzbek. Je ne vais pas partager mon « setup » mais plutôt tous les IDE, au sens large, que j’ai utilisé jusqu’à maintenant pour le développement Web.

    • Microsoft FrontPage 🤢
    • Dreamweaver MX
    • Komodo Edit
    • Espresso
    • Coda
    • Adobe Brackets
    • Sublime Text 2
    • Sublime Text 3
    • Atom
    • Visual Studio Code

    J’ai adoré utiliser Espresso pour le CSS et Coda pour le PHP, mais j’avoue que mon préféré jusqu’ici c’est VSCode. Déjà avant que GitHub soit racheté par Microsoft j’adorais coder dans Atom. Ça fait maintenant plus de 6 ans que je code dans VSCode et je ne compte pas changer !


  • Should masonry be part of CSS grid? – Ahmad Shadeed

    Bookmarked Should masonry be part of CSS grid? by Ahmad Shadeed.

    If we go with the new syntax (display: masonry), it will need a few years to become supported in all major browsers. Let’s be honest, a layout is a major part of a web page that makes it hard to apply progressive enhancement. You either have a masonry or not, right?

    Making it part of CSS grid will at least guarantee that the layout will work, but without the masonry stuff.


  • CSS Cap Unit – Ahmad Shadeed

    Bookmarked CSS Cap Unit by Ahmad Shadeed.

    A look at how I solved a design problem with CSS cap unit.


  • Double your specificity with this one weird trick – Cirrus’s Realm

    Je me souviens avoir déjà utilisé cette technique par le passé, mais c’était un rappel nécessaire pour moi. J’utilise beaucoup trop souvent !important à mon goût.

    Une autre technique que j’utilise c’est d’ajouter un sélecteur d’attribut en plus, mais c’est moins joli.


  • Guillemets, quotes, etc.

    Je viens de tomber sur cet article de Stefan Judis et ça m’a rendu fou ! Fou parce que depuis quelques années je fais beaucoup d’intégrations multilingues en anglais, allemand et français et je n’ai jamais eu connaissance de ces valeurs open-quote/close-quote.

    J’ai hâte de les utiliser dans mes futures intégrations !


  • Éviter le soulignement des pseudo-éléments dans un lien

    Je viens de découvrir qu’en ajoutant display: inline-block sur le pseudo-élément ::before ou ::after d’un lien <a></a>, on peut annuler l’affichage du style text-decoration: underline sur le pseudo-élément même si on le veut sous l’élément en lui-même…

    C’est bien après plus de 10 ans de carrière dans le Web…

    https://codepen.io/nighcrawl/pen/dyLvYoV


  • Modifier l’état d’une checkbox en fonctions de ses checkboxes filles

    Cette semaine je travaillais sur un projet dans lequel une page affiche une liste de documents que l’on peut filtrer à l’aide de checkboxes. Dans cet article je vais vous exposer un cas d’usage que j’ai rencontré et comment je l’ai solutionné.

    (suite…)

  • Mettre en place un « dark mode » simplement

    Cela fait un moment que j’avais mis en place la possibilité de choisir entre un thème sombre et un thème clair pour lire mon blog. Et ça fait presque aussi longtemps qu’il était éclaté au sol, dans le sens où même si on choisissait l’un des modes, les préférences du système prenaient de nouveau le dessus au rechargement de page. On va voir ensemble ce qui n’allait pas et donc ce qu’il ne faut pas faire. (suite…)

  • Impression et en-tête de page : casse-tête

    Il y a quelques semaines, je travaillais sur un template de bilan comptable, destiné a être imprimé via notre application IBAKUS®COMPTA, dans lequel l’en-tête de page devait se répéter sur chaque pages du document.

    L’en-tête de page était constitué de plusieurs éléments permettant d’identifier le déposant (le nom de la société, son adresse, son numéro RC et TVA, etc.), la date d’impression, le titre du document, etc. Quelque chose dans ce style là : (suite…)


  • Une navigation 3D en CSS et jQuery

    Les éléments  de navigation sont essentiels lorsqu’on conçoit un site Internet, que ce soit pour la navigation entre les différentes pages d’un site, ou simplement se déplacer vers différentes sections d’une même page. Claudia Romano propose un concept de navigation responsive simple mais avec beaucoup de caractère. Idéal pour la navigation d’un site type portfolio.


  • Une présentation vidéo en HTML, CSS et JS

    Il y a déjà quelques mois, j’ai eu la tâche de trouver un moyen de présenter différent aspects d’une application que mes collègues et moi développons chez Ibakus Europe.

    L’idée était de faire une sorte de présentation vidéo expliquant les différents menus de l’application et que l’on puisse « naviguer » dans celle-ci, un peu comme une sorte de PowerPoint vidéo. (suite…)


  • Des boutons qui ont du style (CSS)!

    Aujourd’hui pour fêter l’anniversaire du blog, voilà un tutoriel qui vous montrera comment créer des boutons super clean et sympa en full CSS (cf. ici sur le blog), grâce notamment aux nouvelles propriétés introduites dans CSS3.

    (suite…)