Page 1 of 1
New Html css question
Posted: Thu Feb 16, 2023 11:37 pm
by jgkoehn
These Css
Code: Select all
.ind1 {
font-size:small;
text-indent:0em;
text-align:left;
margin:.4em 0em 0em 0em;
}
.ind1a {
font-size:small;
text-indent:0em;
text-align:right;
margin:-1.2em 20% 0em 25%;
}
should look like this (from google)
- css.JPG (13.06 KiB) Viewed 11208 times
But it looks like this (in RichViewEdit) - ignore the blue background:
- css-prob.JPG (14.77 KiB) Viewed 11208 times
Ideas as to the problem?
Re: New Html css question
Posted: Fri Feb 17, 2023 12:49 am
by jgkoehn
The problem is the@
Code: Select all
/* Breaks new html engine
@media speech {
.digits {
-epub-speak-as: digits
}
.spell {
-epub-speak-as: spell-out
}
}*/
/*Page Margins*/
/* Breaks new html engine
@page {
margin:1em 1em 1em 1em;
}
/*End of Page Margins*/
span.font_1 {
font-family:"SBL_Hbrw";
}
/* Breaks new html engine
@font-face {
font-family: 'SBL_Hbrw';
src: url("../fonts/SBL_Hbrw.otf");
}*/
Re: New Html css question
Posted: Fri Feb 17, 2023 8:45 am
by Sergey Tkachenko
Currently, TRichView HTML import engine supports only the following At-rules: @charset, @include, @media, @layer.
For @media queries, TRichView chooses content for screen, so all content inside "@media speech" is legitimately ignored.
For @layer, layer priorities are ignored, however all content for layers is read.
I'll check if rules like @page or @font-face are processed incorrectly and can break further CSS reading. If yes, it will be fixed in the next update.
PS: TRichView does not support margins specified in %, so they should be loaded as zero margins. I am not sure how this content can be placed at the right side in the same line. If it uses inline or floating blocks, this feature is not supported as well. So the only result that I can expect after fixing is right-align of the blue text, but from the new line.
Can you send me a sample HTML file with this code, for example to email richviewgmailcom?
Re: New Html css question
Posted: Fri Feb 17, 2023 4:48 pm
by jgkoehn
Email sent over with a sample and the css.
I did find if I comment out @page and @font-face the css works again. Like you said it went to the next line down.
Here is a sample of the xhtml
Code: Select all
<p id="pA5g" class="ind1">1</p>
<p class="ind1a"><a href="chapter06.xhtml#z118-1" id="ASTxg">4</a>, <a href="chapter09.xhtml#z317-1" id="AnUvc">203</a>, <a href="chapter12.xhtml#pz471-1" id="A1-qv">357</a>, <a href="chapter15.xhtml#pz601-1" id="AZKMq">487</a>, <a href="chapter16.xhtml#z636-1" id="AJqEB">522</a>, <a href="chapter27.xhtml#z1095-1" id="AbyB2">981</a></p>
Which uses the above css, from what I can tell one has a top margin of .4 and the other of -1.2 so this must be how it overlaps. It may be an inline or a floating block as you said below.
Re: New Html css question
Posted: Wed Feb 22, 2023 2:06 am
by jgkoehn
Were you able to confirm this or should I send more information?
Re: New Html css question
Posted: Wed Feb 22, 2023 9:54 am
by Sergey Tkachenko
Sorry for the delay.
I sent a fixed unit by email.
TRichView assumed that at-rules have either empty {}-block or container {}-block. But some at-rules, such as @page and @font-face, are normal {}-blocks.
After this fix, all CSS blocks must be processed, and fonts become small.
However, two paragraphs are not moved at the same line. As I understand, it is implemented by negative top margin of right-aligned paragraphs (not supported by TRichView)
Re: New Html css question
Posted: Thu Feb 23, 2023 12:31 am
by jgkoehn
Thanks for the fix and all your hard work it is working nicely
Re: New Html css question
Posted: Fri Mar 10, 2023 12:39 pm
by Sergey Tkachenko
Fixed in TRichView v21.1