how to stretch pic size to cover webpart area (picture library slide show)

qasimidl 106 Reputation points
2023-06-07T11:33:43.2+00:00

Hi,

I am using SharePoint 2019.

using " picture library slide show " webpart (with picture library) to make image. slider.

Problem:

its width is to small, how can i extend width or Strech it to page ( PFA )

smallimae.PNG

Note:

in attachment "red color " means to extend image to cover such area.

"yellow " color means, its currently covering area or size of picture.

thanks

Microsoft 365 and Office | SharePoint | Development
0 comments No comments
{count} votes

1 answer

Sort by: Most helpful
  1. RaytheonXie_MSFT 40,486 Reputation points Microsoft External Staff
    2023-06-08T07:13:50.2133333+00:00

    Hi @qasimidl

    Modern SharePoint pages support layouts that allow users to organize the information they present on their pages. Users can choose from a number of different section layouts such as two columns, three columns, or one-third column. Modern pages in communication sites offer an additional section layout named Full-width column. This layout spans the full width of the page without any horizontal margin or padding. SharePoint Framework web parts can be placed in any layout, but because of extra requirements, web parts must explicitly enable support for the full-width column.

    By default, SharePoint Framework client-side web parts can't be placed in full-width column layouts. To allow users to add your web part to full-width columns, in the web part manifest (*the *.manifest.json file next to the web part .ts file) set the supportsFullBleed property to true.

    {
      //...
      "requiresCustomScript": false,
      "supportsFullBleed": true,
      "preconfiguredEntries": [{
        //...
      }]
    }
    

    If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.


Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.