0

When you use Visualforce page as Quick Action and modal popup window opens - it occupies 50% of container width. According to Create Object-Specific Quick Actions article

For a Custom Visualforce action, select the Visualforce page, and then specify the height of the action window. The width is fixed.

Is there a "best practice" way to adjust width in this case using some code?

2 Answers 2

3

The width is fixed. You're meant to create a responsive design that fits in the margins. No css or JavaScript you write can change this.

5
  • Thanks for confirming! Is the same formally possible when you use Lightning Component for Quick Action, not Visualforce page?
    – Victor
    Commented Feb 15, 2018 at 11:30
  • 1
    @Victor The width of a Quick Action is also fixed, so you should be using SLDS to create responsive layouts. Remember that a Quick Action will appear on phones, tablets, and the desktop, so you need to have a responsive UI design that will fit all three device profiles.
    – sfdcfox
    Commented Feb 15, 2018 at 15:38
  • Thank you, your answers and comments are very useful. I got it about responsive UI of content displayed in Quick Action modal. I'm just concerned about what I see here lightningdesignsystem.com/components/modals. There is written about large modals occupying 90% of width. Isn't it something we can use in Lightning Component to make Quick Action modal purposely occupying 90% of width? If no, I just wonder what are they talking about here?
    – Victor
    Commented Feb 16, 2018 at 14:02
  • 1
    @Victor It's something that they use for recordEdit, etc. The quick actions always use the smaller 50% version.
    – sfdcfox
    Commented Feb 16, 2018 at 14:24
  • Thanks. Adding related idea here, so people coming and reading this can vote and hopefully we'll see this feature available soon success.salesforce.com/ideaView?id=0873A000000E6ocQAC
    – Victor
    Commented Feb 21, 2018 at 9:21
0

I think you can achieve it by doing some CSS adjustments. Check the following blog which has an example with source code.

How to recreate modal component for force:lightningQuickActionWithoutHeader ( Showing quick action same as Lightning Experience Standard modal )

You must log in to answer this question.

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