-
AuthorPosts
-
May 7, 2024 at 8:19 pm #1442608
Hi, I guess my custom css produces a glitch on mobile: The underlined font is not displayed properly and the cookie banner appears misplaced (at the far bottom of the page).
On Desktop everthing looks great. Can you help me please?This is my custom css:
/* Header mobile */ @media only screen and (max-width: 767px) { .responsive #top #wrap_all #header { position: fixed; } } @media only screen and (max-width: 767px) { .responsive #header_main .container { height: 50px !important; } .responsive .logo a { vertical-align: top !important; } .responsive .logo img { max-height: 50px !important; } } @media only screen and (max-width: 767px) { .responsive #top #wrap_all .main_menu { top: -15px; height: 45px; left: auto; right: 0; display: block; position: absolute; } } @media only screen and (max-width: 500px) { .responsive #top #wrap_all #main { padding-top: 50px !important; } } /* Farbe Nachrichtenversand */ h3.avia-form-success{ color:#99a502!important; } /* Header Button Mobile*/ @media only screen and (max-width: 767px) { .home .avia-fullscreen-slider .caption_bottom .slideshow_caption { bottom: 325px; left: 300px; } .home .slideshow_inner_caption .avia-slideshow-button.avia-button { background-color: #a37652; color: white; border-radius: 10px; } } @media only screen and (max-width: 767px) { #top #wrap_all .slideshow_inner_caption .avia-slideshow-button.avia-button { background-color: #a37652; color: white; border-radius: 10px; } } /* Text mit Foto*/ .avia_textblock p img { border-radius: 100%; box-shadow: rgba(255, 255, 255, 0.6) 0px 0px 4px 4px; } .avia_textblock img.alignleft { margin-right: 40px; margin-bottom: 20px; } @media only screen and (max-width: 767px) { #hello .avia_textblock img { width: 50%; } } /* ScrollDown Pfeil */ #top .scroll-down-link { color: #a47654; } /* Blog Leerzeile entfernen */ .page-id-691 #after_section_2 { display: none; } /* Blog Postdatum entfernen */ .page-id-691 .av-masonry .av-masonry-date { display: none; } /* SocialMedia Icons*/ #top #wrap_all .av-social-link-instagram:hover a, #top #wrap_all .av-social-link-instagram a:focus { color: #fff; background-color: #c82161; } /* Icon Circle schneller*/ .avia_start_animation .avia-icon-circles-inner { transition: all 0s cubic-bezier(0,0,0,0); } /* Desktop Menu*/ @media only screen and (max-width: 2500px) { #top #header.av_header_transparency .av-main-nav > li.menu-item { display: none!important; } #top #header.av_header_transparency .av-burger-menu-main { cursor: pointer; display: block!important; } } /* Header Button Desktop*/ @media only screen and (max-width: 450px) { .slideshow_inner_caption { top: -40px; } } @media only screen and (min-width: 768px) { #top .caption_bottom .slideshow_caption .slideshow_inner_caption { position: relative; text-align: center; } #top .slideshow_inner_caption .avia-slideshow-button.avia-button { width: 500px; height: 56px; font-size: 22px; } @media only screen and (min-width: 768px) { .slideshow_inner_caption { top: -125px; } } #top #wrap_all .slideshow_inner_caption .avia-slideshow-button.avia-button { background-color: #a37652; color: white; border-radius: 10px; } #top #wrap_all .slideshow_inner_caption .avia-slideshow-button.avia-button:hover { background-color: #c79a52; color: white; border-radius: 15px; } /* CookieBanner*/ #top .avia-cookie-consent .avia-cookie-consent-button.av-extra-cookie-btn, #top .avia-popup .avia-cookie-consent-button.av-extra-cookie-btn { background-color: #484f5d; color: #ffffff; border-color: #484f5d; border-radius: 10px; } #top #wrap_all .header_color #menu-item-1628.av-menu-button-colored > a .avia-menu-text, #top #wrap_all .header_color #menu-item-1627.av-menu-button-colored > a .avia-menu-text { background-color: #484f5d; color: #ffffff; border-color: #484f5d; border-radius: 10px; } .html_elegant-blog #top .avia-content-slider .blog-categories { display: none; }
Website-Link on private content.
Thank you in advance an best regards!
May 8, 2024 at 9:48 am #1442655Hey northorie,
Thank you for the inquiry.
We’ve found an invalid css rule above, which we’ve corrected. We have also removed duplicated css media queries. Please delete everything and replace it with this code.
// https://pastebin.com/ABdSuACk
Best regards,
IsmaelMay 9, 2024 at 12:37 pm #1442807Thank you so much for your effort!
I’m very thankful So glad I chose enfold out of all available themes :)Topic can be closed
May 10, 2024 at 4:52 pm #1442891Hi,
Great, I’m glad that Ismael could help you out. Please open a new thread if you should have any further questions or problems.
Best regards,
Rikard -
AuthorPosts
- The topic ‘Glitch on mobile’ is closed to new replies.