Hacker News new | past | comments | ask | show | jobs | submit
> Admittedly, however, support for the <dl> element is not yet universal.

Wait what? <DL> has been in HTML since.. the first draft in 1993!

I like DL's but they can be challenging to style. This article is using a lot of fixed pixel widths which would break on really small screens or larger data.

loading story #48250362
Granted, I do not know what I am doing with CSS, but the Character Sheet example seems standard flexible elements?

Some of the extracted CSS chunks

  #statblock{
    box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);
    font-family:Lato,'Trebuchet MS',sans-serif;
    font-size:85%;
    min-width:50ch;
    max-width:70ch;
    margin-inline:auto;
    background-color:#fffaf0;
    padding-inline:2rem;
    padding-block:1rem
  }
  dl.statblock-bio{
    color:maroon;
    line-height:1.5;
    border-top:5px solid maroon;
    border-bottom:5px solid maroon;
    margin-block:0.75em;
    padding-block:0.75em
  }
  dl.ability-scores{
    min-width:40ch;
    display:flex;
    justify-content:space-around;
    color:maroon
  }
  dl.ability-scores>div{
    text-align:center;
    line-height:1.5
  }
  dl.ability-scores dt{
    font-weight:700
  }
loading story #48249894
{"deleted":true,"id":48248529,"parent":48248200,"time":1779550257,"type":"comment"}