How to create margins between Action Text paragraphs?

rubyonrails-talk
1

It appears that Action Text’s Trix editor creates paragraphs by inserting <br>s, not by wrapping text with <p>. So to add an inter-paragraph gap, to my knowledge I must add styling directly to these <br>s, but the MDN docs says that is not recommended:

Note : Do not use <br> to create margins between paragraphs; wrap them in <p> elements and use the CSS margin property to control their size.

Unfortunately, even though just adding br { margin-bottom: 10px; } does work in Firefox (and probably others, didn’t check yet), it appears this is needed in Safari:

br {
  margin-bottom: 10px;
  content: "";
  display: block;
}

Could anyone familiar with Action Text or Trix comment on this choice of <br> and if we could/should consider using <p> instead?

2

I can tell you that there are several closed issue requests to change the default block from <div> to <p>, such as this one and this one. The response given (in 2019) was: “It’s not a simple change and it’s not a high priority for us.”

I couldn’t tell you if priorities ever changed because I don’t use it. (Due to this.)

3

Thank you @burmashave, that’s unfortunate. Thankfully there is a workaround.