hi, i did look in to the forum and try out all the code about showing the login on mobile device, but still cant get it to work, i do understand the code have to put in under theme panel> custum CSS and the code is
@media (max-width: 767px){
.td-header-top-menu {
display: block!important;
}
}
@media (max-width: 767px){
.td-header-sp-top-menu{
left: 15px!important;}
}
@media (max-width: 767px){
.td-header-sp-top-menu .td_data_time{
display: none;
}
}
but it still didn’t work, the website address i am working on is http://www.scooptw.acsite.org/
can you plz help me out
thank you
Hello,
CSS is very specific and a code you find in our forums will not work anymore if modification to css were already applied. In your case, this code should fix things up.
@media (max-width: 767px){
.td-header-top-menu-full{
display: table!important;
background-color:#222!important;}
.td-header-sp-top-widget{
display: none!important;}
.td-header-sp-top-menu{
float: none!important;
display: table !important;}
.td_data_time{
display:none!important;}
.td-header-style-8 .td-header-top-menu{
padding:2px 0!important;}
.top-header-menu li{
margin-left:-280px}
.td-header-top-menu a{
color:white!important;}
.td-header-top-menu{
background-color:#222!important;
}}
result: http://screencast.com/t/NYJKcOIFW1
Thanks.
hi Bogdan B.
first of all thank you for the quick reply,
do i put this on Theme panel> custum CSS
cos i did put it in still didnt work,
is it because i have also put this under the advance css phone section so it messed up?
@media(max-width:767px){
.test, .td-main-sidebar{
display: none !important
}
}
thanks for the help
the website again is
http://www.scooptw.acsite.org
Hi,
Please replace the old code with this one:
@media (max-width: 767px){
.td-header-top-menu-full{
display: table!important;
background-color:#222!important;}
.td-header-sp-top-widget{
display: none!important;}
.td-header-sp-top-menu{
float: none!important;
display: table !important;}
.td_data_time{
display:none!important;}
.td-header-style-8 .td-header-top-menu{
padding:2px 0!important;}
.top-header-menu li{
margin-left:-280px}
.td-header-top-menu a{
color:white!important;}
.td-header-top-menu{
background-color:#222!important;
display:block!important;}
}
Thanks
hi Bogdan B.
thx for the reply,
it worked perfect now quick question if i also wanted to show the social icon on the right side is it possible, if not its fine
thx alot
Hi!
You can make them appear if you change the code i gave you. Change this:
.td-header-sp-top-widget{
display: none!important;}
to this: .td-header-sp-top-widget{
display: inline-flex!important;}
They will appear but positioning and making them responsive is a challenge all by itself. You need a bit of CSS knowledge to achieve this. If not, you can hire a freelancer to do it for you if you really need to.
Thank you!
Thx Bogdan it work exactly how i wanted, thank you 🙂
