Formatting & CSS in Child Theme Not Recognized After Update to Enfold 5.6.8

Hi Rikard,
I have been able to address most of the issues, except for one. The dash shown in the screenshot below is not displaying for the list items in the blue area under the “HIGHLIGHTS” and “WHAT’S INCLUDED” headers on pages like this one:

https://www.maritimetravel.ca/escorted-vacations/majestic-japan

Here’s the CSS that was being used and is now now being recognized:

.highlight-bullet li{list-style: none;}
.highlight-bullet li:marker{content::'\e814' !important; font-family: "entypo-fontello";}

Here’s a screenshot of how the list should look:
https://www.maritimetravel.ca/wp-content/uploads/Example-of-Correct-List-Style.jpg

• This reply was modified 1 year, 1 month ago by NicomIT.

Hi Rikard and Ismael,
We actually had to revert the theme on the live website back to the older version after discovering more issues. So the list items issue mentioned above is working now while we have the old version of the theme active.

The new issue we are having is on travel agent pages their interview is displaying below their photo and contact info. It should be beside the photo and contact info. We have the theme updated to the latest version on our staging copy of the website and you can see a page with this issue linked in the private content.

I have tried a number of things in the CSS to fix the issue, but haven’t had any luck. Right now, the row layout for the space between the two columns is set to “Space between columns (6% – theme default). If I change that to a different % or “no space between columns”, both columns display beside each other again. However, the size of the column with the agent photo is not correct.

The other issue is if I need to fix this in the page template options, then it would be really time consuming since we have over 500 agents that have pages and each would need to be updated individuallly.

Could you have a look at the page below and let me know if there is something that can be edited or added in the CSS to fix the issue on all the pages?

Thanks.

Hi Ismael,
Sorry about that. You should be able to access the website now with the password that was provided. We currently don’t have an merging/compression enabled under the theme preferences. I have checked the agent pages in different browsers, cleared cache, etc. but still see the same issue.
Ryan

I was able to address the issue on the agent page, but we are still having the same problem that was mentioned in the initial post related to the dashes not displaying under the “HIGHLIGHTS” and “WHAT’S INCLUDED” headers on pages like this one:

https://www.maritimetravel.ca/escorted-vacations/majestic-japan

Here’s a screenshot of how the list should look:
https://www.maritimetravel.ca/wp-content/uploads/Example-of-Correct-List-Style.jpg

Any help with this would be appreciated.

Thanks Ismael. That looks to have worked, but the dashes are displaying above the list items instead of beside them. See this screenshot:

https://www.maritimetravel.ca/wp-content/uploads/Updated-List-Items.jpg

I added the code to the media query for screens under 767px. So if you resize the Majestic Japan page, you will see the changes that have been applied with the CSS you provided. If you can help with getting the dashes to display beside the list items like a bullet would, that would be great. Thanks.

Thanks Ismael. That looks to have worked. The only thing outstanding is for longer list items, the second line of text is wrapping under the dash instead of lining up with the first line of text. This wasn’t happening before we updated the theme.

https://www.maritimetravel.ca/wp-content/uploads/List-Items.jpg

Thanks for the help Nikko. That did the trick.