before-topic-progress outlet がなぜ <span\> で囲まれているのか?

モバイルのタイムラインコンテナにコンテンツを追加しようとしていました。

このコンテナには2つのアウトレットがあります。

before-topic-progressafter-topic-progress です。

before-topic-progress<span> で囲まれており、その理由がわかりません。:thinking:

コンテナはインラインではなく、このアウトレットの周りに意図的に span がラップされる理由が見当たりません。これには明白な目的がなく、独自のコンテンツレイアウトを妨げます。例えば、ボタンを挿入したい場合、この span のせいでボタンが他の要素の高さと一致できなくなります。

image

これを解決するエレガントな方法が見当たりません。最も簡単なのは、次のようなものを使用することです。

#topic-progress-wrapper > span:first-child {
    display: flex;
  }

しかし、複数のプラグインやコンポーネントが同じアウトレットを使用する場合、親に flex を強制すると、他のコンテンツのスタイルが崩れる可能性があります(これは稀なケースだと思います)。

もしこの span に目的がないのであれば、このファイル から削除することは可能でしょうか?

「いいね!」 2

はい、削除できると思います。記憶が正しければ、これらのスパンはアウトレットのレガシー動作により近いため追加されました。ご経験されたように、これらは邪魔になる傾向があるため、ケースバイケースでかなりの数をすでに削除しています。

こちらで対応します:

「いいね!」 3