Hallo in die Runde,
ich habe folgendes Problem mit unserer Homepage:
Der Header wird auf dem Smartphone nicht automatisch verkleinert, so dass der Lower-Header in dem wichtige Informationen stehen nur auftaucht wenn man manuell auf dem Handy die Schriftart verkleinert oder es quer nutzt.
Ich habe mich zwar schon an ein paar Änderungen die ich online gefunden habe versucht, allerdings alles erfolglos.
Der aktuelle media query Code ist der nachfolgende, Theme st VW Eco Nature, Link zur Website: https://wildtierhilfe-rhein-nahe.de/
Kann mir hier vielleicht jemand helfen?
/*------------------RESPONSIVE MEIDA-------------------*/
@Media screen and (max-width:600px) {
#sidebar h3, #sidebar .wp-block-search .wp-block-search__label{
margin: 0px auto 10px auto;
}
.woocommerce ul.products[class*=columns-] li.product, .woocommerce-page ul.products[class*=columns-] li.product{
width: 100% !important;
}
#slider .inner_carousel,
.search-box,#topbar,.logo,
#topbar .custom-social-icons{
text-align: center;
}
.custom-social-icons{
padding: 5px 0;
}
.logo {
padding: 5px 0;
}
#slider .carousel-control-prev,
#slider .carousel-control-next{
width: auto;
left: auto;
}
#slider .carousel-control-prev{
right: auto;
}
#slider .carousel-caption {
padding: 0;
right: 10%;
left: 10%;
top: 50%;
}
#slider .inner_carousel h1{
font-size: 25px;
}
.serv-box h4{
padding: 10px 0;
font-size: 25px;
}
#slider .inner_carousel p{
display:none;
}
#slider .more-btn a {
padding: 12px 8px;
}
.nav-links{
margin-bottom: 20px;
}
.related.products ul li {
width: 45.75% !important;
}
.serach_inner form.search-form{
max-width: 250px;
}
.serach_inner label {
width: 80%;
}
body.page-template-custom-home-page.admin-bar .header-fixed, body.admin-bar .header-fixed {
margin-top: 0px !important;
}
.copyright .widget, .copyright p {
float: none;
width: 100%;
text-align: center;
}
.wp-block-woocommerce-empty-cart-block ul.wc-block-grid__products{
padding-left: 10px;
padding-right: 10px;
}
.wp-block-woocommerce-empty-cart-block tr.wc-block-cart-items__row {
gap: 0.4em;
}
.wp-block-woocommerce-empty-cart-block td.wc-block-cart-item__total{
padding-left: 0px !important;
}
.wp-block-woocommerce-empty-cart-block li.wc-block-grid__product{
max-width:100% !important;
float:none;
flex: 100% !important;
}
}
@Media screen and (max-width: 1000px){
.menubar .nav ul li a:focus,
a.closebtn.mobile-menu:focus{
outline: 1px solid #000;
}
.toggle-nav {
display: none;
position: relative;
width: 30px;
cursor: pointer;
margin: 0 auto;
}
.toggle-nav i {
font-size: 20px;
color: #fff;
border-left: solid 1px #48b42a;
border-right: solid 1px #48b42a;
padding: 15px;
}
.toggle-nav button {
background: transparent;
border: none;
padding: 0;
}
.sidenav {
height: 100%;
width: 100%;
position: fixed;
z-index: 999999;
left: 0;
top: -110%;
overflow-x: hidden;
overflow-y: scroll;
background: #fff ;
visibility: hidden;
transition: all 0.5s ease-in-out;
cursor: zoom-in;
}
.sidenav.show {
visibility: visible;
top:0%;
}
.sidenav .closebtn {
position: absolute;
right: 25px;
font-size: 36px;
display: block !important;
color: #000;
padding: 0;
top:0;
}
a.closebtn.mobile-menu{
border-right: none;
}
.sidenav #site-navigation {
width: 100%;
}
.toggle-nav span{
font-size:30px;
cursor:pointer;
text-align: right;
}
.toggle-nav{
display: block;
}
.toggle i.fa.fa-bars,.toggle i.fa.fa-times {
float: right;
color: black;
}
.main-navigation ul{
position: relative;
top: 25%;
width: 100%;
text-align: center;
margin-top: 0px;
float: none;
}
.main-navigation ul ul li{
display: block;
}
.menubar .nav ul li{
border-top:1px #f1f1f1 solid;
display:block;
}
.main-navigation ul li a{
padding: 8px;
text-decoration: none;
font-size: 15px;
color: #000;
display: block;
transition: 0.3s;
float: none;
margin: 5px 0;
border-right: none;
}
.main-navigation a:hover {
background: #fff !important;
color: #24a500 !important;
}
.main-navigation ul li ul li a:before{
content:"\00BB \00a0";
}
.main-navigation ul.sub-menu a:hover{
padding-left:20px !important;
background: #fff !important;
}
.main-navigation ul ul{
position: static;
width: 100%;
background: transparent;
border-top-width: 0px;
border-bottom-width: 0px;
box-shadow: none;
}
.main-navigation ul ul a{
border-bottom: none;
text-align: center;
padding-left: 40px;
}
.main-navigation ul ul ul.sub-menu a{
padding-left: 40px;
}
.main-navigation li{
padding: 0;
display: block;
text-align: center;
}
.main-navigation ul li:last-child{
border-bottom: 1px #f1f1f1 solid;
}
.main-header-box{
padding-bottom: 15px;
}
#mySidenav {
text-align: left;
display: inline;
}
.main-menu {
padding: 0em;
padding-top: 50px;
}
.main-navigation ul.sub-menu>li>a:before {
content: unset;
}
.main-navigation ul.sub-menu>li>a:hover:before {
opacity: 0;
left: 0px;
width: 0px;
}
.sf-arrows .sf-with-ul:hover:after,
.main-navigation ul li li:hover .sf-with-ul:after{
content: '\f107';
font-weight: 600;
font-family: 'Font Awesome 5 Free';
color: #000;
}
.sf-arrows .sf-with-ul:after{
content: '\f106';
position: absolute;
height: 0;
width: 0;
border-top-color: #e1e1e1;
color: #000;
font-weight: 600;
font-family: 'Font Awesome 5 Free';
margin-top: 0px;
font-size: 12px;
padding: 0px 10px;
}
#slider img {
height: auto !important;
}
.ad
