Joomla Templates Club 406,261 posts

[romolo Friend romoloJoin date: August 2012Posts: 585Downloads:97Uploads:37 Thanks: 79 Thanked: 23 times in 11 posts]

#201567

Hi when we get down to a mobile/tablet size the JA promo bar is covering the sidebar navigation… How can we get around this? Please advise
Thanks

---

Attachments:

1. 

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#550706

You can move the button of JA promo bar module to left on mobile/tablet device on this case

Open templates/ja_nuevo/css/custom.css file and add new rule

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
.ja-promo-bar .buttons span {
left: 0 !important;
}

}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
.ja-promo-bar .buttons span {
left: 0 !important;
}
}

Let me know if it helps

[romolo Friend romoloJoin date: August 2012Posts: 585Downloads:97Uploads:37 Thanks: 79 Thanked: 23 times in 11 posts]

#550848

Hi Ninja,

Thank you for your response.. The code you provided hasn’t resolved the issue.. The promo bar is still displaying on the left side and partially covering the sidebar.

Please advise how to resolve.

Thanks

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#550943

@romolo: Just for better clarification, please include screenshot with describe on that here for further investigation. I will help you out.

[romolo Friend romoloJoin date: August 2012Posts: 585Downloads:97Uploads:37 Thanks: 79 Thanked: 23 times in 11 posts]

#551015

Hi Ninja,

Thank you for your response.

Please see the attached screenshot for the issue we are having.

Thanks

---

Attachments:

1. 

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#551077

Your site is down but you can try to fix this bug with my css style below

Open templates/ja_nuevo/css/custom.css file and add new the css style

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
nav#t3-mainnav {
padding: 0px 54px 0px 0px !important;
}

} @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
nav#t3-mainnav {
padding: 0px 54px 0px 0px !important;
}
}


[romolo Friend romoloJoin date: August 2012Posts: 585Downloads:97Uploads:37 Thanks: 79 Thanked: 23 times in 11 posts]

#551193

Hi Ninja,

Thank you for your response. We have added this to custom.css however it hasn’t had any effect on the position of the promo bar… It is still covering the side nav bar when browser is resized to mobile size.

Please advise
Thanks.

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#551284

I could not access URL of your site and admin login of your site included on thread. You can pm me URL, admin and ftp credentials of your site. I will hep you to solve it directly on your site.

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#551338

<em>@romolo 447894 wrote:</em><blockquote>Hi Ninja,

Thank you for your response. We have added this to custom.css however it hasn’t had any effect on the position of the promo bar… It is still covering the side nav bar when browser is resized to mobile size.

Please advise
Thanks.</blockquote>

I just fixed it directly on your site. Please check it again, let me know if it helps

[Author]

Posts