function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Kibwe Williamson 11Kibwe Williamson 11 

make lwc not scrollable

Is there a way to make it so that a modal isn't scrollable? I'm trying to get the entire modal to display whether the tablet is held vertically or horizontally. Right now it works fine on desktop but won't display the full modal on a tablet.
SwethaSwetha (Salesforce Developers) 
HI Kibwe,

Can you share a minimal code snippet that can be used to replicate the behavior?

Checked related: https://salesforce.stackexchange.com/questions/150777/disable-body-scroll-on-modal-open-in-locker-service-friendly-way

Thanks
Kibwe Williamson 11Kibwe Williamson 11
<div class="slds-is-relative slds-modal_small">
                        <div class="slds-grid slds-wrap" style="text-align: left">
                            <div class="slds-col slds-size_2-of-4 slds-text-align--center">
                                <div class="slds-align_absolute-center">
                                    First Name1:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="FirstName1" placeholder="First Name1" value="{!v.firstName1}" />
                                <div class="slds-align_absolute-center">
                                    Last Name1:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="LastName1" placeholder=" Last Name1" value="{!v.lastName1}" />
                                <div class="slds-align_absolute-center">
                                    Phone:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="Phone" placeholder="Phone" value="{!v.phone}" />
                                
                                <div class="slds-align_absolute-center">
                                    Mobile:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small"
                                                 label="Mobile" placeholder="Mobile" value="{!v.mobile}"/>
                                
                                <div class="slds-align_absolute-center">
                                    Email:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="Email" placeholder="Email" value="{!v.email}" />     
                            </div>
                            
                            
                            <div class="slds-col slds-size_2-of-4">
                                <div class="slds-align_absolute-center">
                                    First Name2:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="FirstName2" placeholder="First Name2" value="{!v.firstName2}" />
                                <div class="slds-align_absolute-center">
                                    Last Name2:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="LastName2" placeholder=" Last Name2" value="{!v.lastName2}" />
                                <div class="slds-align_absolute-center slds-text-align--center">
                                    Street:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="Street" placeholder="Street" value="{!v.enteredStreet}" />
                                
                                <div class="slds-align_absolute-center">
                                    City:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="City" placeholder="City" value="{!v.enteredCity}" />
                                
                                <div class="slds-align_absolute-center">
                                    State:
                                </div>
                                <lightning:select variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small"
                                                  label="State" value="{!v.enteredState}">
                                    
                                    <aura:iteration items="{!v.stateList}" var="stateChoice">
                                        <option text="{!stateChoice.label}" value="{!stateChoice.value}" selected="{!stateChoice.value == v.enteredState}"></option>
                                    </aura:iteration>
                                </lightning:select>
                                
                                <div class="slds-align_absolute-center">
                                    Postal Code:
                                </div>
                                <lightning:input variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small" required="true"
                                                 label="Postal Code" placeholder="Postal Code" value="{!v.enteredPostalCode}" />
                                
                                <div class="slds-align_absolute-center">
                                    Country:
                                </div>
                                <lightning:select variant="label-hidden" class="slds-size_2-of-3 slds-align_absolute-center slds-m-bottom_x-small"
                                                  label="Country" value="{!v.enteredCountry}">
                                    
                                    <aura:iteration items="{!v.countryList}" var="countryChoice">
                                        <option text="{!countryChoice.label}" value="{!countryChoice.value}" selected="{!countryChoice.label == v.enteredCountry}"></option>
                                    </aura:iteration>
                                </lightning:select>
                            </div>

                        </div>  
                        <div class="slds-align_absolute-center">
                                    <lightning:button label="Continue" onclick="{!c.verifyAddress}" class="slds-align_absolute-center"/>
                                </div>
                    </div>
                        </div>
                    </aura:set>
                </aura:if>
            </aura:set>
        </aura:if>     
    </div>