Section backgrounds are not displaying as set

Hi,

I have recently almost completed a site that uses a lot of backgrounds, both images and solid and gradient colors. In some cases, the backgrounds that are set are not displaying correctly.

The first is here: https://www.earthfieldtechnology.com/services/#studies. The background for each of the list sections is set to be a light gray at 0 location and white at 100 location. As you can see, it is not displaying any background behind the lists.

The second is here: https://www.earthfieldtechnology.com/services/#CompleteDataProcessing. The list in the box wrap on the right should have a black background at location 0 and a dark blue background at location 100. It is also displaying with a transparent background.

Can you help me figure out why these two areas are displaying correctly?


Thanks so much,

Debbie

Comments

  • Hi,

    I do not know how, but you get "%" in the gradient.

    When you remove this sign, the gradient will work correctly.

    Best regards

  • Thank you so much! To fix this, am I just going to need to copy the corrected CSS and paste it in the CSS section at the bottom of the page or is there a better way to correct this error?

    It’s weird that it’s only adding the percentage sign to some of the gradient backgrounds and not all of them. Is this a bug in the theme or have I done something wrong somewhere? When creating the backgrounds, I used the BeBuilder and just picked the colors that I wanted for the gradient using the color picker on the color field.

  • You should find it in the color input fields.

    If you do not see it there please send us the WordPress dashboard access privately through the contact form, which is on the right side at http://themeforest.net/user/muffingroup#contact, and we will check what might be the reason.

    Notice!

    Please attach a link to this forum discussion.

    Sending incorrect or incomplete data will result in a longer response time.

    Therefore, please ensure that the data you send are complete and correct.

    Thanks

  • This is how I entered the colors for the gradient. I used the BuBuilder color gradient background option. The % sign does not show up with the hex code for the color. So, I need to know how to remove the % sign. Do I just need to copy the CSS code and remove it from the code and then paste it into the CSS section at the bottom of the page? Or is there a better way to remove it?

  • Please send us the WordPress dashboard access privately through the contact form, which is on the right side at https://themeforest.net/user/muffingroup#contact and we will see where this % sign comes from.

    Notice!

    Please attach a link to this forum discussion.

    Sending incorrect or incomplete data will result in a longer response time.

    Therefore, please ensure that the data you send are complete and correct.

    Thanks

  • It is due to the Angle value. I moved the slider to any value and back to zero, and it started to work correctly:

    I tried to replicate this issue in my environment, but with no luck, so I do not know what could cause it.


    Best regards

  • Thank you. I have done what you did and so far it seems to work. Although I also got it to work for a while after moving the gradient location slider to 1 or to 99 rather than 0 and 100. But after a few page refreshes, it reverted back to no background. Hopefully, the angle slider adjustment will continue to work.

    Thanks so much for your support.

  • Just a quick update. After refreshing the page a couple of times the backgrounds went missing again. I have just copied the CSS code for each wrap and pasted the corrected code into the CSS section at the bottom of the page and it seems to be working correctly now.

  • Do you have any caching tool enabled?

    It might be causing that.


    Best regards

Sign In or Register to comment.
This website uses cookies

We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services.

Cookies are small text files that can be used by websites to make a user's experience more efficient.

The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission. This means that cookies which are categorized as necessary, are processed based on GDPR Art. 6 (1) (f). All other cookies, meaning those from the categories preferences and marketing, are processed based on GDPR Art. 6 (1) (a) GDPR.

This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.

You can at any time change or withdraw your consent from the Cookie Declaration on our website.

Learn more about who we are, how you can contact us and how we process personal data in our Privacy Policy.

Please state your consent ID and date when you contact us regarding your consent.