I have created a SharePoint Page using Wiki page option. - I used the two column option and created the page. Added the html code for accordions using the Js and some css style I did that by using Insert-> Embedded code -> added the code in the box and it was added as a webpart and it solved my purpose. - But here is a new problem, I don't want the CSS to be applied to the other column of the page. How to avoid that.

Also, I want to change the color of the alternate header to grey, any code for that would really help, thank you. please help

Best Regards Vishnu

<script src="..//SiteAssets/jquery-2.0.2.min.js"></script>
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8">
/*** CSS for collapsable headers ***/

/*** Expanded h2 ***/
#DeltaPlaceHolderMain h2:before {
  display: inline-block;
  margin-right: .5em;
  border-radius: 2em;
  padding: 0 .05em .05em ;
  background: black;
  color: #fff;
  cursor: pointer;
  font: bold 0.8em/0.8 verdana, sans-serif;
  content: '\2212'; /* math operators minus sign */
/*** Collapsed h2 ***/
#DeltaPlaceHolderMain h2.expand:before {
  content: '\2b'; /* basic latin plus sign */


<div id="DeltaPlaceHolderMain">



  [1]: https://i.stack.imgur.com/bzQZg.png
  • Does the second column web-part contains your HTML code for displaying the data in the grid? Jun 9 '20 at 11:03
  • No, The first column has the code in it, The second column of the page has no html added. Thanks Vishnu
    – Vishnu
    Jun 10 '20 at 12:23

Your Answer

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

Browse other questions tagged or ask your own question.