-
Notifications
You must be signed in to change notification settings - Fork 3
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
CSS white-space: pre-wrap setting inserts lots of whitespace in se-type #35
Comments
Hi @simpsoneric
Yes, please go ahead and let me know if anything wrong with Se-Section. By the way I doubt the hardlinebreak is the source of issue. |
I started my debugging this morning and have a couple firefox developer mode screen shots below. If I remove the I am not a web developer, but it seems like it may be a problem with my Current summary:
I will continue investigating later this morning. |
TW-Section/source/section/viewtemplates/sections.tid Lines 9 to 16 in bc01bba
I think the ListMacro is the source of the enclosing
Results in <p>
content here
</p> And when the TL;DRAs far as I can tell, not a TW-Section problem. I'm wondering if there is a way to "squash" whitespace between HTML elements, and if that would fix it. |
I highly recommend posting in talks.tiddlywiki.org. You may look at TiddlyWiki repo on problem with generating extra p tags. |
It would be worth testing the https://github.com/kookma/TW-Section/blob/bc01bba6e52d937e7ad309d23862f793a627af70/source/section/viewtemplates/sections.tid file with
It should not be the cause of the extra whitespace and P elements in HTML output since it's CSS
As I wrote try Also the TW parser itself has a P-tag problem. ATM it does create a lot of unnecessary P-tags. See: TiddlyWiki/TiddlyWiki5#7061 |
That's an interesting view. Especially the quote from "1974, Brian W. Kernighan" that line breaks should be placed after commas. ... This may have been valid for 1974 text editors but immediately breaks down in times where documents are viewed on "responsive" devices. eg: On My mobile. There are 4 runts, that are caused by hard line breaks. So for modern text that renders into HTML output I am OK with extra line-breaks at the end of a sentence. If and only if the next sentence deserves it. BUT this discussion is way off-topic and should be moved over to talk.tiddlywiki.org |
Once again, I'm not too familiar with web technologies, but the extra rendered space seems similar to: The extra For example, in the screenshot of the DOM below: The highlighted whitespace-only DOM element is two newlines. Once again though, if I remove the following CSS: [data-tags*="hardlinebreaks"] div.tc-tiddler-body p {
word-break: normal;
word-wrap: break-word;
white-space: pre-wrap;
} Those whitespace-only nodes do not get inserted into the DOM. <p>
<div>some content</div> <!-- NEWLINE here in paragraph text is "white-space: pre" formatting honored, and inserted into DOM
<div>other content</div>
</p> |
You are probably right. That's why I wrote, that you should try to use |
Sorry for the delayed response, the above change did not (seem) to the whitespace problem. I was slowly trying to understand some of the codebase and where Going back to my previous investigation: #35 (comment), I'm leaning towards a problem with the outer According to my in-experienced read of the HTML specification:
Therefore, the generated DOM using the outer
Specifically, since the content is arbitrary tiddlers the resulting DOM looks like <p> <!-- from outer $list
<article class="se-article">
<p>nested</> <!-- Invalid
<section>...</section> <!-- Invalid
<section>...</section> <!-- Invalid
</article>
</p> I am not familiar with the TiddlyWiki codebase, but I'm wondering if the correct fix is to change the |
As you discovered, TiddlyWiki generates extra and invalid html code. This has been raised several times in forum and github. |
@simpsoneric |
@kookma, yes please feel free to close this one out. In the future I may revisit the DOM related generation within TW core. As we noticed above, it is not specific to TW-Section. |
When writing my tiddlers, I like to use Semantic-linebreaks in my tiddlers:
I have a tag called "hardlinebreaks" that I enable to force this in TW without resulting to triple-quotes.
I like to read my .tid files in text form, so wrapping everything in """ is quite noisy.
I've recently come across your TW-Section plugin and I'd really like to start utilizing it.
Although, it (appears) to insert many blank lines into the tiddler.
This makes the
hardlinebreaks
rendering somewhat unreadable due to the extra whitespace.An example where I tried this out is below:
I can start poking around in the source to see if this is something I can find and fix,
but I thought I'd reach out to you first to see if you had any quick tips.
The text was updated successfully, but these errors were encountered: