Blog | falk-m.de
Like other developers, I read articles, test new features, analyze code from others and so on.
Also, I have some interesting code snippets used in projects, if I need them, I always search in old projects.
This blog is my central place now, to collect interesting code snippets, features, etc. |
RSS Feed
html dialog element demo
from falk-m.de
· 2025-03-20
JSCSSHTML
Visit demo
standard dialog
A dialog element is hidden by default.
.showModal() open the centered dialog and add a Backdrop element.
.show() open the dialog on top position and don't add a Backdrop...
Fluid-design
from falk-m.de
· 2025-03-05
CSS
Fluid-design want to implement a responsive design without using of media queries.
Try the Demo on your desktop pc and play with font size and window width.
Padding
A normal padding looks nice on w...
CSS order property
from falk-m.de
· 2025-02-27
CSS
Short CSS thing:
Imagine a CSS flexbox container with three children: 1 | 2 | 3
Did you know that we can change the order of the children by using the order attribute?
Examples:
.container div:nth-...
CSS presentation
from falk-m.de
· 2025-01-25
CSSPRESENTATION
This month I presented some interesting (partly new) CSS stuff.
Slides (html)
Slides (Pdf)
pointer: coarse
from falk-m.de
· 2024-11-18
CSS
In CSS exists media queries so detect the input device of the user.
@media (pointer: fine) {} can use for styles, specially for users with a mouse pointer.
@media (pointer: coarse) {} detect touch ...
scoped css variables
from falk-m.de
· 2024-10-29
CSS
A Example:
There is a default button with an icon and a text inside.
The button is blue by default with black text color and black icon.
:root {
--blue: #cbe7ff;
--red: #ff300b;
--yell...
image gallery
from falk-m.de
· 2024-10-28
CSS
Today I saw a nice responsive image gallery.
.gallery {
--min: 15rem;
--aspect-ratio: 4/3;
--gap: 10px;
display: flex;
...
Links and stuff of the week
from falk-m.de
· 2024-10-18
CSS
Links
quilljs WYSIWYG Editor
cally calendar and date picking component
inline-flex
I read in another blog display: inline-flex and never heard about it before.
This codepen discripe the differenc...
font with integrated syntax highlighting
from falk-m.de
· 2024-10-18
CSS
With modern font techniques, I don't know how it works (font colors and so on),
it is possible to highlight the syntax or source code.
html, js, css.
I don't read something amount PHP support:/
But...
responsive font-size
from falk-m.de
· 2024-04-02
CSS
Here are three simple lines of code to smooth sizing the root font size depends on the screen size.
:root {
font-size: calc(1rem + 0.25vw);
}
You can also use 'clamp' to use the smooth sizing o...