search

datopian / flowershow

💐 Publish your obsidian digital garden or any markdown site easily and elegantly.
https://flowershow.app/
MIT License
750 stars 92 forks source link

CSS issues with Ultrawide monitors #560

Closed a-oneil closed 5 months ago

a-oneil commented 10 months ago

Hello!

I'm currently experiencing a problem that I'm able to replicate on the flowershop.app docs page.

I have an Ultrawide 34" monitor that is 2560x1080. When viewing my website on this screen, the main content div of the app is floated off to the right side of the page and the sidebar will lay overtop of the content.

This does not seem to be a problem on 1920x1080 sized monitors / mobile.

I tried playing with the css in Chrome's Devtools a little bit and was able to get the container to move around but I'm not even seeing .max-w-8xl and .mx-auto in the css files of the app so this must be imported from somewhere else.

.max-w-8xl {
    max-width: 88rem;
}
.mx-auto {
    margin-left: auto;
    margin-right: auto;

Does anyone have any suggestions on what I can do to fix this? Any help is much appreciated! Thank you.

image

claudio4 commented 10 months ago

This issue is not limited to ultrawide monitors, it affects any monitor with a width higher than 1920px, even if they have the standard 16/9 aspect ratio. I'm experiencing the same issue in a monitor with 2560x1440px resolution.

https://github.com/datopian/flowershow/assets/9874071/0ad7fe67-7c69-418c-a12a-927e697ca224

olayway commented 9 months ago

@rc-austinoneil, @claudio4 Thanks for reporting! I'll look into this!

olayway commented 5 months ago

This has already been fixed