I have changed to sizes to all of these areas and when I look at tablet and mobile they adhere to these changes. If I can get the code for all of these to input so that they revert to the originals, it would be much appreciated. The original parameters looked great.
Hey carlamurray,
social icons:
@media only screen and (max-width: 768px) {
#top .social_bookmarks li a {
font-size: 15px !important;
}}
Menu:
@media only screen and (max-width: 768px) {
.header_color .main_menu ul:first-child > li > a {
font-size: 10px !important;
}}
Logo:
@media only screen and (max-width: 768px) {
.logo img {
height: 50px !important;
}}
Secondary menu:
@media only screen and (max-width: 768px) {
#top .sub_menu ul.menu li > a {
font-size: 10px !important;
}}
Adjust media queries as needed.
Best regards,
Andy
Hi Andy,
So the boxes around the social icons are still huge, and the secondary menu is overlapping the logo, whereas before it was in between the icons and logo. Lastly, how do I make that header background white?
Thanks
Hi,
it would be best to open different tickets for different questions.
However, would you mind posting us a screenshot/mockup of what you would like to achieve? You can upload the screenshot to imgur.com or dropbox and share the link here :)
Best regards,
Andy
Hi Andy,
Actually all part of the same issue. Ie: I wanted the header to look the same previous to enlarging font and social icons, part of that would have been a white background?
Hi,
use this code:
@media only screen and (max-width: 768px) {
#header_meta .container {
background-color: white !important;
}
#header_meta .social_bookmarks li a {
color: black !important;
}}
Make sure it doesn’t conflict with any other code you’re already using.
Best regards,
Andy