Can't define class in Custom CSS

Hello,

I want to add a date selection from a booking site and can’t customize it. I added the javascript tag before the body tag.
And then added this code in a classic raw content:

div class=“ibe” data-region=“emea” data-channelcode=“pannoniatowerdirect” data-widget=“property_check_availability”

Then I thought I can customize the widget in the Custom CSS … but nothing happens. Isn’t it possible to change the font color and button? The button would be great if it is like the global button…
https://thebookingbutton-help.siteminder.com/s/article/000001676

Greetings Dominik

Hi Dominik,

There is an coming soon page active on your site. Kindly provide the admin access of your site so that we can check it.

Thank you.

Hello Jade,
I added a secure note after my first post - can you see this?
Greetings

Hi there,

What is the login link of your site?

I tried checking /wp-admin, /wp-login.php and /admin but they don’t seem to work.

Hope this helps.

/login
didn’t notice, that this isn’t standard … sry :slight_smile:

Hi there,

Thanks for that.

I was able to login to your site and the reason why the custom CSS is not working is because the code you have added in the raw content element generates and iframe which is not accessible to the custom CSS you add on the site.

If you want to style the form further, you will have to check it from the site that generates the form.

Hope this explains it.

Yeah thx, helps a lot.
I wrote to the support, but don’t have much hope.

You’re welcome.

Hello,

I don’t think it is a X Theme problem … so it isn’t your range of duty.
But maybe you know this problem? Why is this Javascript running in Google Chrome and Safari and on mobile devices, but only the shitty Microsoft Edge or older Internet Explorer make problems? Couldn’t find any solution so far.

But an X Theme question:
Is it possible to show a button or a text only in Microsoft Edge and IE?

Greetings
Dominik

Hi there,

That’s possible, example, please add ie-only or not-for-ie to your button’s class. Then add this CSS to your global custom CSS once


.ie-only {
display: none;
}

    @media all and (-ms-high-contrast:none)
     {

     .ie-only {
        display: inline-block;
     }

     .not-for-ie {
        display: none !important;
     }
   
     }

Thanks!

Hello Rad,

thanks, that worked for the old IE but not for the Edge.
Buuuut with this information I found that for the Edge I need this too:

@supports (-ms-ime-align:auto) {

Thank you :slight_smile:

You’re most welcome.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.