Semantic-ui-react: CSS Issue -> Modal window render out of screen
the css comes with the CDN link
and the css that come with semantic-ui-css package are different.
I am using the css come with package that create problem with modal window.
half of the modal window render out of the winow screen.
SajagTiwari
All 3 comments
馃憢 Thanks for opening your first issue here! If you're reporting a 馃悶 bug, please make sure you've completed all the fields in the issue template so we can best help.
We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.
![welcome[bot] picture](https://avatars0.githubusercontent.com/in/4141?v=4&s=40)
welcome[bot]
on 2 Apr 2018
This happens because the newer Version of Semantic-ui-css doesn't use the CSS position: fixed; top: 50%; left: 50%; anymore. Semantic-UI-React however still applies margin-top: -(half-height)px to the .ui.modal-element.
This happens when using Semantic-UI-CSS Version 2.3.X. Forcing version 2.2.12 fixes this problem for now.
ekrokowski
on 2 Apr 2018
Duplicate of #2550
brianespinosa
on 2 Apr 2018
Related issues
wyemun
路
3Comments
dilizarov
路
3Comments
levithomason
路
3Comments
eGust
路
3Comments
nolandg
路
3Comments
Most helpful comment
This happens because the newer Version of Semantic-ui-css doesn't use the CSS
position: fixed; top: 50%; left: 50%;anymore. Semantic-UI-React however still appliesmargin-top: -(half-height)pxto the.ui.modal-element.This happens when using Semantic-UI-CSS Version
2.3.X. Forcing version2.2.12fixes this problem for now.