quarto-blog/styles.css at main · stevelinberg/quarto-blog · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
/* css styles */

/* Hat tip for much prettier description list CSS styling: https://clicknathan.com/web-design/styling-html-5-description-lists-formerly-known-as-definition-lists-properly/comment-page-1/#comment-159496
*/

dl {
    display: flex;
    flex-wrap: wrap;
    width:100%;
    max-width: 670px;
}
dl > * {
    padding-top: 0.5em;
}
dt {
    width:30%;
    font-weight: bold;
    text-align:right;
}
dd {
    width:60%;
    padding-left:1em;
    margin-left: 0px;
}
dd + dd {
    width: 100%;
    padding-left: calc(30% + 1em);
}
dt + dt {
    padding-right: 60%;
}
dt + dt + dd {
    margin-top: -1.625em; /* own height including padding */
    padding-left: calc(30% + 1em);
}