Toggle label alignment problem
vinoth2442 opened this issue · comments
Describe the bug
Toggle label positioned on top of the container
Desktop (please complete the following information):
- OS - iOS
- Browser - chrome
- Version - 102
I have attached screenshot
font: var(--body-1);
Not working inside shadow dom
Hi @vinoth2442 , the screenshot is not showing up, would you mind uploading it again?
font: var(--body-1);Not working inside shadow dom
Is kor-styles.css loaded correctly?
font: var(--body-1);Not working inside shadow dom
Is kor-styles.css loaded correctly?
Yes loaded.
Problem here is need to add font: var(--body-1); inside :host .
It's now present inside body{}
Hi @vinoth2442 , the screenshot is not showing up, would you mind uploading it again?
any update about this issue?
any update about this issue?
Hi, I investigated the issue and it doesn't seem like the --body-1 font declaration is related to that, because even when I force font: unset; it still doesn't get misaligned.
The only way I found to reproduce the issue was applying css align-items: baseline;, so in this case could you please confirm that there is no interfering css inherited by the kor-toggle element?
If you have a link to the repo or code snippet I'd be happy to take a look as well.
host([size="body-1"]) {} is empty