Sticky header/menu is hiding behind custom review widget

[bittersweetchox]

I recently added a widget to my website homepage and one other page to display our Tripadvisor reviews. This was done using a HTML code snippet (generated by the widget website I used) which was inserted into a raw html section within those pages. The widget is showing over the top of the sticky header and therefore blocking the menu dropdowns which looks very unprofessional and reduces functionality. This problem is exclusive to the widget, as shown in the image below. How can I solve this? I can provide code if needed, Thanks.

Here is the website: www.bittersweetchocolates.co.uk 

 

[Huptech-Web · Accepted solution]

Hello! @bittersweetchox Please follow these steps to add this CSS code:

1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open "base.css"
6. Add the following code at the end of the file.

body .shopify-section.pxs-rich-text-section {
    position: relative !important;
    z-index: 1 !important;
}

 If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the solution.

[bittersweetchox]

Thank you! This worked perfectly

[LuffyOnePiece]

Hi @bittersweetchox ,

Add below css to the base.css file.

body .eIMmgT * {
    z-index: 1 !important;
}

Thank you