Articles tagged with “css”

Mise à jour d’une série de gabarits de mise en page web, créés initialement en 2008, avec les techniques CSS de 2024.

html css

Today we’re talking about how transparent iframes, dark mode, unreadable text and varying levels of browser support are doing my head in. But don’t worry, there’s light at the end of the tunnel.

html css browsers

J’ai donné une petite interview pour le site alsacreations.com, un site communautaire autour des technologies web.

css frontend

Learn how to create an accessible button style which can be used with the correct semantic element: <a> or <button>.

html css accessibility

It’s definitely possible! But it’s not as easy as using linear-gradient in CSS. We explore a few techniques for using gradient fills on SVG icons in a web page.

svg css

Web browsers do not print background colors by default. Here’s a trick for printing a flat color, e.g. if you have a white logo or graphic.

css svg

Styling HTML elements as if they were plain Markdown text.

html css

Pass several colors and styles to a SVG symbol instance, using CSS Custom Properties. This requires preparing SVG icons to accept specific names.

svg css

CSS Locks are a Responsive Web Design technique that lets you transition smoothly between two property values when the screen gets smaller or bigger.

css typography rwd

Support de présentation de ma conférence à la KiwiParty 2016 à Strasbourg. On y parle de stratégie pour gérer ses styles CSS sans provoquer des conflits dans tous les sens.

css talk

You don’t have to use the “em” for everything. Pixels are probably better for media queries and layout, and “rem” can be useful for text.

css typography

When using “object-fit: contain”, the painted image may be smaller than the actual <img> element. Styling this image becomes challenging.

css

Some demos of how em-based media queries and px-based widths can become mismatched, and should be avoided.

css rwd

A series of tests for inserting content in “::before” and “::after” pseudo-elements.

css

Exploring some possible syntaxes for namespacing HTML classes and selectors.

html css

How I use Markdown-inspired headings in my CSS comments to structure my code and make it easier to parse visually and maintain.

css

How to build a video background that fully covers an element using iframes and media queries.

html css

Can we use CSS transitions to fade in or fade out elements on a page? These tests show limitations in current web browsers.

css outdated

You will want to use <button> elements for e.g. buttons triggering JavaScript actions, and not <a href="#">…</a> which has different semantics. Here’s how to reset button styles efficiently.

html css

This is a base stylesheet that I use in some of my projects as an alternative to CSS Resets. I don’t just copy it and go on writing other CSS styles, but tend to modify the rules to fit each project.

css

[NO ABSTRACT]

html css outdated

What can you put in a ::before?

css

Une page de test pour la propriété CSS font-size-adjust, qui permet d’ajuster la taille du texte en visant un ratio entre hauteur des minuscules (x-height) et taille du texte (font-size).

css browsers

Les éléments positionnés grâce à la propriété CSS float peuvent dépasser de leur conteneur. Cet article explique comment contourner le problème.

css

[NO ABSTRACT]

css outdated

D’où viennent les écarts étranges que l’on observe parfois entre certains blocs d’une page? Comment se fait-il que des marges disparaissent? Et pourquoi cette marge-là semble-t-elle s’appliquer à mon conteneur et pas à mon titre ou mon paragraphe? La fusion des marges pourrait bien être derrière tous ces mystères.

css

[NO ABSTRACT]

css outdated

[NO ABSTRACT]

css outdated

[NO ABSTRACT]

html css outdated

[NO ABSTRACT]

css outdated

[NO ABSTRACT]

css outdated

[NO ABSTRACT]

html css outdated

[NO ABSTRACT]

css test outdated

[NO ABSTRACT]

css outdated

[NO ABSTRACT]

css outdated

[NO ABSTRACT]

css outdated

Démonstration d’une mise en page avec un pied de page apparaissant en bas de la fenêtre du navigateur lorsque le contenu de la page est court.

html css outdated

Ce tutoriel présente l’unité `em` et la démarche à suivre pour l’utiliser à bon escient, ainsi que quelques conseils pour vous aider à assurer autant que possible la lisibilité du texte sur votre site… et donc à en améliorer la qualité générale.

css accessibility typography

[NO ABSTRACT]

css outdated

[NO ABSTRACT]

css outdated

[NO ABSTRACT]

css outdated