i have two web zone i need to have one in the left to stay while the other scroll when the browser's scroll bar scrolls. any suggestions or ideas are welcome

  • or even a div tag which can hold links and some texts on the left side ? – Rinu Oct 16 '16 at 13:08

don't know why you would do this but if you had to I would open up sharepoint designer, navigate to the page. edit the page and open in advanced mode. Look for the following tag <WebPartPages:WebPartZone with a title attribute of zone 1, within that add a styles attribute with display as fixed: styles="Display:fixed;"

so should look on the lines of:

<WebPartPages:WebPartZone id="g_sd23423432434sdfsd" runat="server" title="Zone 1" styles="Display:fixed;"

as you can see above all I did to zone 1 was add in some custom style to set that zone fixed to the screen. you can play around with the style as you please but I would recommend using your browser first (developer tools by pressing F12 on the browser) to play around before doing any changes through SPD.

a little guid on how to do that:


use this as a guide to use SPD on SP online to get to the page and edit.


using script editor:

<script type="text/javascript">

   $("#ControlIDOfZone").css( "Display", "Fixed" );

  • hi ali, on the left webpartzone there are many links and in the right the contents. once you scroll down the page you wont be able to see the links. that is why i had to do this. Can we use this script editor? – Rinu Oct 17 '16 at 4:47
  • ahh i see what you mean, just updated answer. – Ali Jafer Oct 17 '16 at 6:32
  • i have updated the same with below details with no luck <script type="text/javascript"> $("#ms-rte-layoutszone-inner").css( "Display", "Fixed" ); </script> – Rinu Oct 18 '16 at 5:34
  • i couldnt find webpart zone as advised the only line which has something related to the webpart is this <WebPartPages:WebPartZone runat="server" ID="Bottom" CssClass="ms-hide" Title="loc:Bottom"><ZoneTemplate></ZoneTemplate></WebPartPages:WebPartZone> am i missing something ? – Rinu Oct 18 '16 at 5:44
  • i presume your referring to the left navigation links? if so add the following in script editor on page: <style> .ms-core-navigation { DISPLAY: fixed} </style> – Ali Jafer Oct 18 '16 at 7:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.