Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

#

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Jump to bottom

Margin issue with 'width: 90%' on wide text blocks #2784

Open
jamiecarter7 opened this issue Oct 12, 2023 · 0 comments
Open

Margin issue with 'width: 90%' on wide text blocks #2784

jamiecarter7 opened this issue Oct 12, 2023 · 0 comments

Comments

@jamiecarter7
Copy link

jamiecarter7 commented Oct 12, 2023 •
edited
Loading

When creating a wide text block in the dashboard - I've noticed a strange margin issue.

Its being caused by the following line

width: '90%',

link -> https://github.com/dhis2/dashboard-app/blob/9c6c0c65a20852fd0f1187cc5a359c9180d5b43b/src/components/Item/TextItem/Item.js#L30C19-L30C19

Seems to create a weird styling bug when using the text block in a wide variant resulting in huge X margins. Its caused because the 'width: 90%' of the texy body a ;margin: 0 auto; used to center it.

Screenshot 2023-10-12 at 14 00 04

Screenshot 2023-10-12 at 13 59 55

It means for some strange margins breaking the visual flow of the cards. Here are 2 examples:

Screenshot 2023-10-24 at 16 04 19 Screenshot 2023-10-24 at 16 04 28
@jamiecarter7 jamiecarter7 changed the title Margin issue with width: 90% on wide text blocks Margin issue with 'width: 90%' on wide text blocks Oct 12, 2023
# for free to join this conversation on GitHub. Already have an account? # to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@jamiecarter7