Welcome to Software Development on Codidact!
Will you help us build our independent community of developers helping developers? We're small and trying to grow. We welcome questions about all aspects of software development, from design to code to QA and more. Got questions? Got answers? Got code you'd like someone to review? Please join us.
Comments on How to control how HTML is copied into the clipboard in plain text form?
Parent
How to control how HTML is copied into the clipboard in plain text form?
Premise
The text/plain representation of my HTML5 markup is inequivalent to its CSS3 markup, even in manners which /plain is able to represent, like the amount of line breaks and depth (or even presence of) indentation. Specifically:
-
When I duplicate the content of a
<blockquote>, it is indented with a tabulator, even though my linked CSS3 stylesheet does not indent it. -
Similarly,
<p>s retain a single line between them even when it is not rendered. -
Likewise, margins that would produce a line between non-
<p>text lack line breaks between them, rendering them nigh unreadable.
For this question, I care about the indentation. However, if someone is competent enough to generalise to the other problems, I'll be glad for the effort.
Demonstration
An example is how, in firefox-142.0, firefox 'data:text/html;charset=utf-8,<!DOCTYPE html><html><body><p>Unindented</p><blockquote>Indented</blockquote></body></html>' becomes:
Unindented
Indented
Rationale
I would like my webpage to be as readable as is possible when duplicated into plain text form with Control. To this end, I've appended colons to <h[1-6]> (with ECMAScript). However, I utilise indentation extensively to indicate nested sections. Until the WHATWG implements an <indent> element, which would presumably be indented as <blockquote> is on paste, I need to manually implement this.
Desire
Can this be achieved? If so, how?
Post
I don't really understand what you're asking (I barely know how to spell "CSS"), so maybe this is way off base. However, you can make your own <indent> in a style sheet. Here is how I do it:
indent {
display: block;
margin-left: 2em;
margin-right: 0;
margin-top: 0;
margin-bottom: 0;
background: none;
}
I also use indentation heavily to show document tree structure hierarchy. I used to use <dl> to get nested indentation back when that was the only option. The <indent> defined in the style sheet is much less klunky and works pretty much as expected.
2 comment threads