1

One of my buttons opens a modal with some content inside. My problem is that the content only shows on half the modal. It's been a long while since I've looked at this but I think this is the right code from the Aura component. Apparently it's looked like this for mnoths without someone telling us. I've been changing the height numbers but still it's cut off. What needs to be updated to fill the whole box?

<aura:component implements="force:lightningQuickActionWithoutHeader,force:hasRecordId">
<aura:html tag="style">
    .slds-modal__container{
    max-width: 80rem !important;
    width:60% !important;
    height ; auto;
    }
    .modal-body{
        height : 550px !important;
        max-height: 800px !important;
        }
</aura:html>
<c:contactRelationshipsContact recordId="{!v.recordId}" />  
</aura:component>

enter image description here

Edit:

If you remove the height/max-height lines it just displays the component size with the white space reduced:

enter image description here

Maybe my question should be how to I make the component height larger?

1
  • Look into the overflow property and see if removing your height and max-height help. I wouldn't set a static height for something like this because screen sizes vary so much and it won't be responsive.
    – nbrown
    Commented Nov 1, 2021 at 17:46

1 Answer 1

2

I got hit by that as well (I too was overriding the Modal Size). If you use this CSS it will fix it.

.slds-modal__content{
    height : 550px !important;
    max-height: 800px !important;
}

My understanding is they added a slds-modal__content size so you need to override that as well.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .