SharePoint 2013 Branding: Fixed Layout

It's quite easy to create a fixed width design in SharePoint 2013. Just a few lines of code and you're up and running.

We need to start by editing our masterpage.

Wrap all the content inside the #s4-workplace div with a new div: <div class="wrapper"></div>. The div.wrapper will be only direct descendant of #s4-workplace.

Next we need a bit of CSS.

#s4-workspace > #wrapper {
     margin: 0 auto;
     width: 1280px; /* change this to the width you need */
}

#s4-workspace > #wrapper #s4-bodyContainer {
    width: 100% !important;
}

And now our fixed width is working.

Fixed width design
Fixed width design

Share this

Did you like this article? Share it!

Keep up to date

Our monthly newsletter. See previous editions.

Related articles