Блог

Когда я использую мобильную версию приложения на устройствах Apple или в веб-браузере, моя кнопка перемещается вместо того, чтобы находиться в нижней части div

HTML:

 <div id="RightContainer" class="ReportContainer">
            <section class="reportSidePanel">

                <div class="ui bottom attached tab segment activeReportPanel" id="RTabContent" data-tab="Report">
                    <div class="ui styled accordion" id="report_accordion">
                        <div id="normal-case-report">
                            <p class="normal-case-report-content">No fracture present.</p>
                        </div>
                    </div>
                    <div class="blue ui buttons submitButtonWrapper">
                        <button class="ui disabled button" id="report-submission-button">Submit</button>
                    </div>
                    <div class="blue ui buttons submitButtonWrapper" id="nextButtonWrapper">
                        <button class="ui button next_button" id="next_button" style="display: block !important;">Next</button>
                    </div>
                    <div class="blue ui buttons submitButtonWrapper" id="resultsButtonWrapper">
                        <button class="ui button" id="results_button">See results</button>
                    </div>
                </div>
            </section>
        </div>
  

CSS:

   #report_accordion {
    display: flex;
    flex-direction: column;
    visibility: hidden;
}
.submitButtonWrapper {
    position: relative;
    bottom: 0;
    width: 100%;
    align-items: center;
    display: flex;
    justify-content: center;
}
  

Как это выглядит на iPhone

Как это выглядит на моем устройстве Android