Afficher un bloc sur toute la largeur de votre site alors qu'il est contenu dans un bloc qui a une largeur limitée.
Astuce, utiliser les unités relatives au viewport :
.full-bleed {
width: 100vw;
margin-left: calc(50% - 50vw);
}Quelques petites astuces pour Firefox, en passant par le about:config.
Quelque idées pour facilement organiser vos classes CSS.
J'utilise notamment la première, la notation .is-open pour les classes d'état, je trouve ça très clair et très pratique, surtout quand vous utilisez SASS.
Une technique intéressante qui consiste à utiliser un composant sans rendu (renderless), invisible donc, pour effectuer les appels AJAX. Ça permet de conserver la logique de la gestion du chargement et des erreurs centralisée et de simplement utiliser les variables exposées par le composant pour connaître le statut de la requête.
Je pense que ça ne s'applique pas à tout (uniquement aux requêtes GET par exemple) mais ça peut servir !
Une méthode pour se souvenir de tout (ou presque), facilement.
Un truc que j'avais aussi envisagé sans jamais le mettre en pratique c'était d'écrire dans une liste, à chaque trou de mémoire, le truc que j'ai oublié. Et ensuite, il faudrait lire toute la liste au moins une fois par jour. Aucune idée si ça marche mais je pense que ça peut aider pour les trucs qu'on oublie tout le temps.
Une introduction au plugin Emmet qui permet d'écrire du code HTML rapidement à l'aide d'expressions qui utilisent une syntaxe proche du CSS.
Un bon aperçu de l'utilisation du phénomène de propagation des évènements JavaScript pour simplifier votre code.
Les choses à ne pas faire avec PostgreSQL.
Il suffit de rajouter #31# devant le numéro que vous voulez appeler.
Pas mal de petites astuces pour JavaScript.
Un moyen d'accomplir un layout à la Masonry avec uniquement du CSS (principalement Flexbox et :nth-child()). C'est très bien pensé malgré les quelques contraintes.
Le plus gros souci pour moi c'est que si un élément est beaucoup plus haut que les autres, les blocs ne s'adapteront pas pour autant et l'ordre de lecture s'en trouvera impacté. Mais pour une grande part des cas, c'est suffisant.
Bon à savoir, vous ne pouvez pas utiliser clip-path et box-shadow sur le même élément. Si vous le faite, l'ombre n'apparaîtra pas.
Solution : utiliser un élément parent pour l'ombre ou alors un pseudo-élément (::before par exemple) correctement positionné.
Accéder aux properties référencées via <context:property-placeholder> depuis un composant Java.
/** Example of accessing a property from Java code. */
public class PropertyAccessExample implements Callable {
protected final Logger logger = LoggerFactory.getLogger(getClass());
@Value("${a}")
String myProperty;
@Override
public Object onCall(MuleEventContext eventContext) throws Exception {
logger.info("From Java a={}",myProperty);
return null;
}
}Il ne faut pas grand chose pour rendre un site de base un peu joli.
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
line-height: 1.6;
color: #222;
max-width: 40rem;
padding: 2rem;
margin: auto;
background: #fafafa;
}
img {
max-width: 100%;
}
a {
color: #2ECC40;
}
h1, h2, strong {
color: #111;
}