Text changing size

[Cherylwoodman]

Hi Themeco team,

When I use Mozilla or Chrome to edit/view this page > http://www.honestyforyourskin.co.uk/the-ordinary-skincare-routine-regimen/ block quotes/accordion and some other text is much larger than is is when you view here.

See this example;

2018-08-30_1352

2018-08-30_1353

How can I correct this? The 1st is too small but it’s the size seen outside of cornerstone.

Cheryl

[christian]

Hey Cheryl,

It’s coming from your custom font tag. You must no

You have 15 of those and none was closed.

Please note also that though the font tag will still work, it’s not recommended to use it as it’s not supported in HTML5 which is used in X. See https://www.w3schools.com/tags/tag_font.asp

I’d recommended that you remove them in your page and use the element’s font size option instead.

Thanks.

[Cherylwoodman]

Hi Christian,

This is so helpful thankyou!

It’s fixed. However there are a few added questions on the back of this;

1. How would i change the colour of an icon but not the text without using font-colour? See here > https://www.screencast.com/t/xiHZ6ihQrWd

2. Some of the icons are no longer working (I’ve had a similar issue with social icons since updating my theme) > https://www.screencast.com/t/NZH1WS2rmG top one is supposed to be a tick in a box

[Prasant]

Hello @Cherylwoodman,

Thanks for updating the thread.

1. Please add following CSS under X > Theme Options > CSS to change icon color:

ul.x-ul-icons i.x-icon-times:before {
    color: #fff;
}

2. Icons on my end are working fine. Please see screenshot. Try clearing cache and load the website again. The difference between icons is because you are using two different icon codes i.e one for Tick Mark icon and another for Square icon.

I have found the proper CSS code selector using the Chrome browser Developer Toolbar:

https://www.youtube.com/watch?v=wcFnnxfA70g

For the CSS code itself, I suggest that you get started with this tutorial:

Thanks.