Contents
An easy way to do this without having to use any code would be to use a wiki page and insert a table with three columns. Place the web part in the middle column and adjust the widths of each column as necessary. All of this can be done within the edit page.
Take one main div, give required width and set margin as auto for center align. Place your tiles in this main div. Then your tiles should appear in the center of the web part.
How do I center an image in SharePoint?
How to align text and images on a SharePoint page
- Step 1: Edit the Page.
- Step 2: Insert Table with 2 rows and 4 columns.
- Step 3: Insert text and images into corresponding cells.
- Step 4: Resize columns as required. Align text as well.
- Step 5: Change table style to Clear. This will hide the light gray border of the table.
Choose “Content Editor Web Part” from the list (in the Media/Content category). Then, select the web part, then click the “Edit Source” button in the ribbon, and finally, paste in the code. You can optionally set the web part to hidden as well in the web part’s properties.
How to add a web part to a page?
This web part can be added to the page just like any other web part, via “Edit Page” (in the Page ribbon), then click one of the “Add Web Part” links on the page or use the “Web Part” button on the Insert ribbon at the top. Choose “Content Editor Web Part” from the list (in the Media/Content category).
How to adjust the margin on a web page?
Make sure you are using the correct tab for the web part (eg. it may not be s4-wpTopTable) , and then try playing around with the margin-left property, adjust it by pixel in your browser’s developer tools by applying margin-left as an inline-style, then once you have the right number of pixels, you can input that number into the code.
You can optionally set the web part to hidden as well in the web part’s properties. Apply the changes to the web part, then save the page and you should be all set. Alternatively, you could accomplish the same by editing the page in SharePoint Designer and adding the code manually.