locked
CSS Issues with summernote - Mixing with site theme RRS feed

  • Question

  • User1953081067 posted

    Hi,

    I'm using the rich text editor summernote with my site. It works (sort of) by the CSS of summernote is mixing with my site theme. I've tried re-ordering the CSS includes with some success, but it's not 100%.

    Any ideas?

    Thanks as always

    Sunday, March 4, 2018 2:15 PM

Answers

  • User-474980206 posted
    If you are using a bootstrap theme, you should get the .less file version of the theme, and rebuild supernote with this less file.

    See bootstrap instruction to build theme with less, and supernotes instructions.
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, March 4, 2018 7:36 PM
  • User1400794712 posted

    Hi richardlaw,

    You can use F12 developer tools to check your css code. It may be some other css code effects it.

    Open F12 developer tools, Ctrl+Shift+C and select the Summernote element. The related css code shows in Styles. You can uncheck and check them to judge if it effects the css of Summernote.

    Please also check the div to contain this Summernote, if the container's width isn't 100% of body, the Summernote can't be 100% either.

    Best Regards,

    Daisy

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, March 5, 2018 7:11 AM

All replies

  • User-474980206 posted
    If you are using a bootstrap theme, you should get the .less file version of the theme, and rebuild supernote with this less file.

    See bootstrap instruction to build theme with less, and supernotes instructions.
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, March 4, 2018 7:36 PM
  • User1400794712 posted

    Hi richardlaw,

    You can use F12 developer tools to check your css code. It may be some other css code effects it.

    Open F12 developer tools, Ctrl+Shift+C and select the Summernote element. The related css code shows in Styles. You can uncheck and check them to judge if it effects the css of Summernote.

    Please also check the div to contain this Summernote, if the container's width isn't 100% of body, the Summernote can't be 100% either.

    Best Regards,

    Daisy

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, March 5, 2018 7:11 AM