semantic-ui modal size keeps extending to the height of a page

It turns out that Bootstrap package is conflicting with Semantic-UI package I use.

Simply by doing:

meteor remove twbs:bootstrap

Things got resolved. Granted, not an ideal solution, but I should not be using both frameworks at the same time anyways.

enter image description here

Well, after about two hours of debugging....

I had the same issue. My solution was modify the CSS of the modal component from Semantic UI in this way:

 .modal { position: relative;} or #myModal { position: relative;}

<div id="myModal" class="ui small modal"></div>

It works for me, I hope to help you. I agree with Michael Khait, this issue maybe occurs for any conflict between Boostrap and Semantic UI

Related