Reply To: [Solved] styling with an identifiers, dividers and text instead of an img

[__]

Semantically, the best element to use would be an aside. However, putting it inside the p creates two problems:

1) Again, semantics. If the floated item isn’t related to the contents of the paragraph, it simply shouldn’t be a child of the paragraph. The only reason you’re putting it there is to make it easier to position.

This problem exists with the image, too. If the subject of the image is not related to the topic of the paragraph (e.g., a picture of a cat in an paragraph about fighter jets), then it just shouldn’t be there.

2) it’s not just an issue of whether the element is display: inline or not. p is one of those odd-rule elements that doesn’t actually require a closing tag. If a not-flow-content element (easiest to think of as anything that is not displayed inline by default) is inside a p, the paragraph automatically closes. Observe:

http://codepen.io/adrian-enspired/pen/bNVpmB

As for the w3c not having things “figured out” yet, keep in mind: (a) the web is a very young medium — it is only now starting to really become “mature.” Print, OTOH, has been around for a few centuries. Yes, some things common in print layouts are simply not technically practical for websites; (b) the w3c writes specs, and the spec follows best practices, which (by necessity) follow practice. The spec is not a plan: it is documentation.