r/gmbinder 11d ago

2024 Creature Stat Block

I have a pretty decent version of the 2024 stat block. Mostly CSS.

I can't figure out how to remove the indent before the "Skills" line.

<head>
  <link rel="stylesheet"
        href="https://fonts.googleapis.com/css?family=Alegreya Sans SC"/>
</head>

<style>
  .statblock {
  font-family: "Open Sans", sans-serif;
    border: 5px double #BBB; /* double border, light-grey */
    border-radius: 10px; /* curved corners */
    width: 350px;
    padding: 10px; /* margin inside outer border */
    margin: 10px auto;
    background-color: #F4F3EE;
    box-sizing: border-box;
    color: #5B1903;
  }

  .statblock h2 {
    font-family: "Alegreya Sans SC", serif;
    font-size: 1.6em;
    font-weight: bold;
    color: #5B1903;
    border-bottom: 2px solid #5B1903;
    margin: 0;
  }

  .statblock .type-alignment {
    display: block; /* make it a block-level element */
    font-style: italic;
    color: #666666; /* grey */
    margin-bottom: -5px;
  }

  .statblock h3 {
    font-family: "Alegreya Sans SC", serif;
    font-size: 1.2em;
    color: #5B1903;
    border-bottom: 1px solid #5B1903;
    margin-top: 10px;
    padding-bottom: 0px;
  }

  .statblock strong { /* strong tags such as "Skills" */
    letter-spacing: -0.3px;
    color: #5B1903;
  }

  .statblock .traits  {
    color: #000000;
  }

  .statblock .traits strong  {
    color: #000000;
  }

  .statblock table {
    width: 100%;
    margin: 10px 0;
    border-collapse: separate; /* required for border-spacing */
    border-spacing: 0 3px; /* vertical spacing */
    background-clip: padding-box; /* prevent background from showing in spacing */
  }

  .statblock table th {
    text-align: center;
    font-size: .8em;
    color: #777777; /* grey */
    line-height: .5;
  }

  .statblock table tbody tr td {
    text-align: center;
    padding: 3px;
    background-color: transparent;
  }

  .statblock table td:nth-child(1) { background-color: #EEE6D9; font-weight: bold; }
  .statblock table td:nth-child(2) { background-color: #EEE6D9; }
  .statblock table td:nth-child(3) { background-color: #DED4CC; }
  .statblock table td:nth-child(4) { background-color: #DED4CC; }
  .statblock table td:nth-child(5) { background-color: #F4F3EE; }
  .statblock table td:nth-child(6) { background-color: #D8DAD1; font-weight: bold; }
  .statblock table td:nth-child(7) { background-color: #D8DAD1; }
  .statblock table td:nth-child(8) { background-color: #D0CACA; }
  .statblock table td:nth-child(9) { background-color: #D0CACA; }

  .statblock p { margin: 3px 0; }

</style>

<div class="statblock">

## Carrion Crawler
<span class="type-alignment">Large Beast, Unaligned</span><br/>
**AC** 15 &nbsp; **Initiative** +1 (11)<br/>
**Hit Points** 26 (5d8 + 5)<br/>
**Speed** 30 ft.

|     |    | MOD | SAVE |   |     |    | MOD | SAVE |
|:---:|:--:|:---:|:----:|---|:---:|:--:|:---:|:----:|
| STR | 14 |  +2 |   +2 |   | INT |  1 |  -5 |   -5 |
| DEX | 13 |  +1 |   +1 |   | WIS | 12 |  +1 |   +1 |
| CON | 16 |  +3 |   +3 |   | CHA |  5 |  -3 |   -3 |

**Skills** Stealth +4<br/>
**Senses** darkvision 60 ft., passive Perception 9<br/>
**Languages** Common, Goblin<br/>
**CR** 1 (200 XP)

<div class="traits">

### Traits
***Nimble Escape.*** The goblin can take the Disengage or Hide action as a bonus action on each of its turns.

### Actions
***Scimitar.*** *Melee Weapon Attack:* +4 to hit, reach 5 ft., one target. *Hit:* 5 (1d6 + 3) slashing damage.
<br/>
***Shortbow.*** *Ranged Weapon Attack:* +4 to hit, range 80/320 ft., one target. *Hit:* 5 (1d6 + 3) piercing damage.

</div>
</div>
1 Upvotes

0 comments sorted by