Child Theme is breaking icons

Comments

• Pablo

  July 2020

  Hello,

  You don't have to use Child Theme to overwrite CSS code.

  What you have problem with is specifity of CSS, you can make your
  CSS rule better by adding more detailed target of your CSS code.

  More
  informations about specifity here, in the mozilla docs - I suggest
  looking there, in my humble opinion, the mozilla docs are really
  well-written.
  

  https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

  
  

  Thanks
  
  

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• NLPwithVanda

  July 2020

  Hello Pablo,

  
  

  I will try that thank you. It's a shame the Betheme developers didn't read this guide, otherwise they'd know not to use !important in a site-wide style sheet ;-)

  
  

  • Always look for a way to use specificity before even considering !important
  • Only use !important on page-specific CSS that overrides foreign CSS (from external libraries, like Bootstrap or normalize.css).
  • Never use !important when you're writing a plugin/mashup.
  • Never use !important on site-wide CSS.

  
  
• NLPwithVanda

  July 2020

  Let's say I do want to use the child theme, what can I do to fix the icons issue?
• Pablo

  July 2020 edited July 2020

  This theme is really huge, it include a lot of css code and !important rule is unavoidable here

  If you have some other questions, feel free to ask.

  
  

  Sorry, but we did not test the booking plugin, so we are not able what exactly need to be fixed.
  

  thanks
  

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• NLPwithVanda

  July 2020

  I know, just poking a bit of fun 

  
  

  Any ideas what could fix the icons not showing up in the child theme?
• Pablo

  July 2020

  But, the icons disappear even when the Child Theme without any modifications is enabled?

  It could be the because of CORS library which hasn’t been installed on your server.
  

  More details about the CORS you can read on http://enable-cors.org/server.html but we recommend to contact with your server administrator this case because he will be able to help you for sure.
  P.S. For .htaccess solution, please visit http://forum.muffingroup.com/betheme/discussion/4902/icons-are-gone-cors-solved-within-htaccess
  

  
  

  Also, check if disabling that plugin solve the problem with disappearing icons too.
  

  thanks

  Learn more: Video Tutorials | How To | FAQ Vote on what comes next
• NLPwithVanda

  July 2020

  Hi Pablo,

  
  

  Yes the problem persisted even with all plugins disabled. 

  
  

  I copied the fonts folder across to the child theme and that solved the problem, if anyone else has the same issue.

  
  

  Not the most ideal solution but I don't expect the icons css to be updated a lot, so should be fine. Otherwise I'll check with my host about CORS library.

  
  

  Thanks for your help!