Removing Line Breaks In Text Copied From A Flex Container
Solution 1:
You're going to have to find another solution.
In a flex container the child elements ("flex items") are automatically "blockified" (details).
This means that a flex item takes on some of the characteristics of block-level elements, including taking up all space in the row.
You may be tempted to just set the items to display: inline
. This would be a waste of time. The display
value of flex items is controlled by the flex algorithm, and any attempt to override that setting is ignored.
Solution 2:
This problem only exists for Chrome. In Firefox, those <span/>
s inside a flex container dont produce a line break upon copying, but <div/>
s do.
Setting the display to something else like inline-block
will fix the problem.
If you need to be using flex, you can modify the copy event and alter the clipboard data: https://developer.mozilla.org/en-US/docs/Web/API/Element/copy_event#Live_example
Post a Comment for "Removing Line Breaks In Text Copied From A Flex Container"