2

I have an action on Contact page which opens a lightning component. The component opens as a popup/modal window, at a specific width. How can I change this width to make it wider?

2
  • You cannot make it larger--you must make your component responsive. It will be a particular size based on the device's screen size.
    – sfdcfox
    Apr 12, 2017 at 9:16
  • @sfdcfox I see the height can be set in the action definition. Can it be set to higher than the page with a scroll bar?
    – Dedo
    Apr 12, 2017 at 10:40

2 Answers 2

2

You can make a internal css file and declare

<style>
.slds-modal__container{
       max-width: 70rem !important;
       width:70% !important;

       }
</style>
1
  • 1
    This doesn't work anymore in Spring '18: FIELD_INTEGRITY_EXCEPTION - Markup for markup://c:[component] may not contain a <style> tag Aug 27, 2018 at 11:26
2

You can declare a <aura:html> tag and Define the css there

<aura:html tag="style">

.slds-modal__container{
            height : auto;
            width: 70%;
            max-width: 70rem;
            }
            .modal-body{
            height : 500px !important;
            max-height: 500px !important;
            }

</aura:html>

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