Problem Customizing Action Bar/Header/Top Bar for Mobile/Responsive
I'm working on a client's WordPress site running BeTheme for a custom Home page. I'm actually having some issues with customizing the Action Bar/Header/Top Bar. I simply want to remove some of the spacing between the social icons and browser top (top margin), and bring up the slider closer to the mobile logo.
Note: It shows "responsive.css" on Chrome Code Inspector console -- reference CSS code and photo below.
@media only screen and (max-width: 767px)
#Top_bar, #Action_bar {
background: #000 !important; // Forces black background
position: static;
}
@media only screen and (max-width: 1024px)
#Top_bar .top_bar_right {
float: none;
top: 0;
height: 0px !important; // Hides Top Bar space above slider on mobile views
padding: 0 10px;
}
@media only screen and (max-width: 1024px)
.header-classic #Top_bar .top_bar_right {
top: 0;
height: 0px !important; // Hides Top Bar space above slider on mobile views
padding: 0 10px;
}
@media only screen and (max-width: 767px)
#Top_bar, #Action_bar {
background: #000000 !important;
margin-top: 25px !important; // Moves top Social icons down from top
}
From above, I can get the Code Inspector to produce my desired changes, but nothing happens after saving in BeTheme admin for Custom CSS. I've flushed the cache on the server and browser, but still no changes are visible.
Any suggestions for support would be greatly appreciated.
Best Regards, Chad, Mpower Web Solutions
Comments
please send us dashboard access privately thru contact form which is on the right side at http://themeforest.net/user/muffingroup#contact and we will check what might be the reason.
Thanks