How to stop div resizing for different screen resolution

Question

It's a wordpress website, I have textboxes, this textbox height is changing according to the screen resolution, so created the ID wrap, still resizing according to the screen, can anyone tell me how to stop rezing

My css

 #wrap{

    height: 630px !important;

    }

<div id="wrap">
<div style="font-size: 60px; color: #399bc8; font-family: IBM Plex serif;"><strong>01</strong></div>
[fusion_separator style_type="default" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" sep_color="rgba(98,57,189,0)" top_margin="" bottom_margin="48px" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center"][/fusion_separator]
<div style="font-size: 40px; color: #3f4143; font-family: IBM Plex serif;">Events</div>
[fusion_separator style_type="default" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" sep_color="rgba(98,57,189,0)" top_margin="" bottom_margin="30px" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center"][/fusion_separator]
<div style="color: #3f4143;">
<ul>
    <li>Get trained on the hospitality industry prior to attending</li>
    <li>Identify key projects and associated project stakeholders – Client, Operator, Consultants, Architects and Interior Designers</li>
    <li>Meet the active Hospitality stakeholders with projects for 2019-2021</li>
    <li>Spend your Marketing budget wisely</li>
</ul>
</div>
<div>[fusion_separator style_type="default" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" sep_color="rgba(98,57,189,0)" top_margin="" bottom_margin="10px" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center"][/fusion_separator]</div>
[fusion_button link="https://thehospitalitynetwork.com/how-it-works/" text_transform="" title="" target="_self" link_attributes="" alignment="" modal="" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="buttonnospan" id="" color="custom" button_gradient_top_color="#ffffff" button_gradient_bottom_color="#ffffff" button_gradient_top_color_hover="#399bc8" button_gradient_bottom_color_hover="#399bc8" accent_color="#399bc8" accent_hover_color="" type="" bevel_color="" border_width="2" size="" stretch="default" shape="square" icon="" icon_position="left" icon_divider="no" animation_type="" animation_direction="left" animation_speed="0.3" animation_offset=""]View More[/fusion_button]

</div>

Answer 1

Try to put the div height in its media query for specific screens resizing. Then have a global definition of the div with a height? This will be a default height, that will get used when the screens are not resizing?

Answer 2

you must set this for textbox ==> overflow-x:scroll; and set fix height or for #wrap