Home > UI/UX Development > CSS > Responsive calendar web part in SharePoint 2013

Responsive calendar web part in SharePoint 2013

Hello everyone, in this post we discuss on how to make calendar web part responsive in SharePoint.

Steps to make Responsive calendar web part

  • First, we need to create calendar list and add some sample events.
  • To display calendar events, here we create web part page and add calendar list.
  • Now edit page in SharePoint designer and add the following CSS to the page.

    After adding above CSS refresh the page and see calendar web part takes content box width.
    * Calendar web part in desktop screen-default Month view.

    * Calendar web part in mobile/laptop screen-default Month view.


    * Calendar web part in desktop screen-Week view.

    * Calendar web part in mobile screen-Week view.

 

This Article is TAGGED in , . BOOKMARK THE permalink.

Leave a Reply

Your email address will not be published.

48 − = thirty nine

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">