-
Posts
-
Hello, could you please help me with the CSS code. I’m not sure if I have it right to center the burger icon and the social media icons, from top to bottom, and keep them in the middle of the header. Right now, the icons are too high. Thanks!
https://jackdalten.armourcloud.io/
/* Mobile-only: make logo larger */
@media only screen and (max-width: 767px) {
#top .logo img {
max-height: 110px; /* adjust: 75–95px */
}
}@media only screen and (max-width: 767px) {
#top .av-burger-menu-main {
top: 50% !important;
transform: translateY(-50%) !important;
margin-top: 55px !important; /* small nudge only */
}
}/* Show & align social icons on mobile */
@media only screen and (max-width: 767px) {
#top .social_bookmarks {
display: flex !important;
align-items: center;
position: absolute;
left: 20px;
top: 50%;
transform: translateY(-50%);
margin-top: 55px; /* match burger offset */
z-index: 100;
}#top .social_bookmarks li {
margin: 0 6px;
}
}Hey bemodesign,
Thank you for the inquiry.
This css code should help — make sure to add it at the very bottom of the previous modifications.
@media only screen and (max-width: 767px) { /* Add your Mobile Styles here */ .responsive #top #wrap_all .main_menu { display: flex; position: absolute; flex-direction: row-reverse; justify-items: center; align-items: center; } }
Best regards,
Ismael
- You must be logged in to reply to this topic.