フレックスコンテナからコピーされたテキストの改行を削除する

Question

フレックスコンテナである1行のアプリケーションがあります。このコンテナには、その行を構成するテキストのスパンが数多く含まれています。

これは奇妙なシナリオにつながります。この場合、行をコピーすると、各スパンの間に改行が入ります。一方、線をレイアウトする他の方法を使用する場合は、すべて1行になります。

I have set up a codepen hereを例として説明します。 2行をコピーしてテキストエディタ（またはここにコメント）に貼り付けて、最初の行が1行で2行目が3行になる様子を見てください。

この問題には誰の前でも誰もがcomeですか？それは本当に私を迷惑にしています。私はコピーを無効にして改行を削除して削除することができますが、それはかなりハッキリです。

div.flex { 
 
    display: flex; 
 
}

Example of copying multiple spans in flex. 
 
<br /> Try copying and pasting the 2 lines below: 
 
<br /> 
 
<br /> 
 
<div class="non-flex"> 
 
    <span>This</span> 
 
    <span>is</span> 
 
    <span>non-flex</span> 
 
</div> 
 

 
<div class="flex"> 
 
    <span>This</span> 
 
    <span>is</span> 
 
    <span>flex</span> 
 
</div>

Answer 1

あなたはこの周りにあなたの方法をハックする必要があるとしています。

flex formatting contextでは、フレックスコンテナ（フレックスアイテム）の子は自動的に「ブロックされます」（details）です。

これは、フレックスアイテムがブロックレベルの要素の特性の一部を占め、その値がオーバーライドされ/無視されることを意味します（display）。