text-font is not working in deep nested structure
Reported by
g.statk...@gmail.com,
Aug 31 2017
|
||||
Issue description
UserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:55.0) Gecko/20100101 Firefox/55.0
Steps to reproduce the problem:
1. Make a deep nested structure
<div>
<span>..12 spans... <span>
<a class='a.aBtn' ><span class='navDecr' ></span></a> ...other 12 <a> tags ...
<ul>
<li><span class='litem' >litem</span></li> ... other 12 li ...
</ul>
</span> ... 12 closing spans
</div>
2. try to apply style to elements in a a.aBtn or li span.litem item elements.
a span.navDescr {
font : 2rem, "Open Sans", sans-serif !important; //this is stroked through , not working. The rest will be working
text-align: right;
text-align-last:left;
font-weight:normal;
font-variant: normal;
font-style:normal;
line-height : 1.5; //will be multiplied with font_size
font-stretch: normal;
font-size-adjust:1;
}
Actual result:
all font rules are working, except font-size is not working. font-size is not working on li items, and on a.aBtn span.navDescr items.
What is the expected behavior?
Expected result:
font-size shall be working, as it works in Firefox.
Link to working font-rules :
https://typejoy.biz/dev/mainHci5/en/bthov3
What went wrong?
font-size rule is not working.
Did this work before? N/A
Does this work in other browsers? Yes
Chrome version: Version 60.0.3112.113 (Official Build) (64-bit) Channel: stable
OS Version: 10.0
Flash Version:
,
Aug 31 2017
Seems the reason is in some of other font rules.
Finally, find out that "line-height" rules makes font-size not to work in Opera and Chrome browsers.
I mean complicated structure is not related to the problem.
a.aBtn span.navDescr, a.aBtn span.navDescr p {
font-family : "Open Sans", sans-serif !important;
font-size : $aBtnFontSize !important;
/* text-align: right;
text-align-last:left;
font-weight:normal;
font-variant: normal;
font-style:normal;
//font_size : 3rem !important;
line-height : 1.5; //opera ignores : //will be multiplied with font_size
font-stretch: normal;
font-size-adjust:1; */
}
I mean complicated structure is not related to the problem. I made a simple line on the top of the page, above the complicated nested structure - it also does not work in Chrome, and Opera if all font rules are applied.
<a class='aBtn' > <span class='navDescr' > <p>navDescr</p></span> </a>
complicated <span><a><ul> structure
Finally, removing the complicated nested structure, and leaving just a line, also does not work for font-size if all font rules are applied .
<a class='aBtn' > <span class='navDescr' > <p>navDescr</p></span> </a>
,
Sep 5 2017
Tested the issue on windows 10 & 7 using chrome M60 #60.0.3112.113 and M63 #63.0.3205.0 and with the given link in comment #0 :https://typejoy.biz/dev/mainHci5/en/bthov3 and observed the font size in chrome and firefox. Attached screenshot of firefox for reference. @ g.statkute-- Could you please confirm attached screenshot is the expected result and if not please help us with the test steps and expected result screenshot for better understanding. Thanks!
,
Sep 5 2017
Yes it works, i have replied below the problem. The reason was that in font definitions i was using *"line-height"* rule, thus font definitions was not working. The deep nesting was not the reason.The reason was *"line-height". *
,
Sep 5 2017
Thank you for providing more feedback. Adding requester "hdodda@chromium.org" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Sep 6 2017
As per comment #4 closing this issue, please raise a new issue if you come across the similar or different issue in any of the latest chrome versions. Thanks! |
||||
►
Sign in to add a comment |
||||
Comment 1 by g.statk...@gmail.com
, Aug 31 2017