CSS rules, text is not visible

Hi,

When checking the style on the web page I see this:
media screen and (min-width: 768px)

media screen and (min-width: 768px)
#klarna_payments_pay_now_container, #klarna_payments_pay_later_container {
    background-color: lightpink;

So that controls why its not visible on mobile view. So if you want that rule to apply on mobile view as well you need to change that CSS to be viewable on lower pixels.

Hmm weird since I haven’t set any media min or max width on klarna. Tried to add some new CSS to fix it and instead everything disappeared in the mobile view cpmpletely. Removed CSS but everything is still missing on mobile view.

seems like klarna is not showing up at all when im not logged in, pretty permlinks and Sweden selected… fixed, had one decimalpoint for prices changed to two

• This reply was modified 3 years, 6 months ago by anderslinn.

@anderslinn

Maybe that css line is coming from some other place then regarding media screen.

How did it look after you got it to show again? If you got any caching running be sure to empty those too before you check the page again.

All cache emptied. Its the same as before Im not sure if im doing it right but adding the following CSS in wordpress extra CSS , shouldn’t this overwrite other rules? Cant seem to find the class for changing fontcolors either, that could also be a way, just need the first textline and terms and condition text to be visible

<pre><code>@media screen and (max-width: 9920px) {
  #klarna-pay-later-main, #klarna-pay-now-main {
   background-color: lightpink;
  }
}

@media screen and (min-width: 20px) {
  #klarna-pay-later-main, #klarna-pay-now-main {
   background-color: lightpink;
  }
}

• This reply was modified 3 years, 6 months ago by anderslinn.

Hi,

Have you tried the iframe settings in the plugin for changing font color?
https://docs.krokedil.com/article/155-klarna-payments-introduction#h-H2_2

I know it’s not good practice to use !important but if you do:

background-color: lightpink !important;

Does it go through then?

!important did not work. Settings for iframe only change some of the font colors, and not the ones I want to change. the marked text here is black on black background.
https://pasteboard.co/K1zjMvz.png

#payment .payment_methods li .payment_method_klarna_payments_pay_later,
#payment .payment_methods li .payment_method_klarna_payments_pay_now {
    background-color: lightpink;   
}

Try this one

• This reply was modified 3 years, 6 months ago by Andreas - Krokedil.

nope ?? but it seems something is messing with the extra CSS. way back i fixed the mobile menu by adding some extra CSS. but all the styles there have gone missing as well. So it seems the issue is somewhere else.

Problem solved. There where errors in previous code that f-ed up fore next rules. Nothing to do with plugin or suggested CSS.
Thanks