Hi,
I added a badge to my home page. It’s only displayed at the page with the id 28. So far it works the way I wanted.
Now I want to hide the badge on mobile devices, but the code I’m using is not working:
1.)
img, a img { border: 0; }
#badge1 {position: fixed;
z-index: 100;
right: 20px;
top: 480px;}
2.)
.page-id-28 #badge1 {display: block !important;}
3.)
@media only screen and (max-width: 768px) {#badge1 { display: none !important; }}
4.)
#badge1 {display: none;}
Can you help me?
Thanks & kind regards
Hi Steffen!
Please remove “!important” from following code
.page-id-28 #badge1 {
display: block !important;
}
Best regards,
Yigit
Hi Yigit,
thanks for your fast reply!
If I remove the “!important” from the code the badge is not displayed at all.
If I add code 1.), 2.) and 4.) ist works fine unless the badge is displayed on mobile devices.
Other ideas?
Hi!
Then please change that code to following one
@media only screen and (min-width: 769px) {
.page-id-28 #badge1 {
display: block !important;
}}
Regards,
Yigit
It works!
Thank you, Yigit!
Hi!
You are welcome!
For your information, you can take a look at Enfold documentation here – http://kriesi.at/documentation/enfold/
And if there are features that you wish Enfold had, you can request them and vote the requested ones here – https://kriesi.at/support/enfold-feature-requests/
For any other questions or issues, feel free to post them here on the forum and we will gladly try to help you :)
Best regards,
Yigit