1. Giver
  2. Wednesday, 27 November 2019
My issue is this: In the giver template I can assign layouts to mobile devices. This works fine on cell phones but on my ipad in landscape mode it shows the pc layout instead of the mobile layout. Furthermore, the menu items are not all fitting on one line and moves to the next line. In the description of the template, I wrote that it is fully responsive so what can I do to resolve this matter?

Inclosed one screenshot made from my PC display to show you how it supposes to look like and another screenshot of my Ipad in landscape mode.
Attachments (2)
Accepted Answer
Hi there,

Thanks for your feedback. I have added this CSS code & solved your issue.


@media (max-width: 1300px){
#sp-header .sp-module-content {
display: flex;
}
}
body.ltr #offcanvas-toggler.offcanvas-toggler-right {
float: right;
margin-right: 20px;
}

@media (max-width: 1300px){
#sp-header .sp-megamenu-wrapper {
padding-left: 30px;
}
}


-Thanks
  1. more than a month ago
  2. Giver
  3. # Permalink
Responses (6)
Hi there,

Thanks for your query. Please add this CSS code inside the custom.css file.


.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
display: inline-block;
padding: 0 10px;
line-height: 120px;
font-size: 14px;
letter-spacing: 3px;
text-transform: uppercase;
margin: 0;
-webkit-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
position: relative;
}


-Thanks
  1. more than a month ago
  2. Giver
  3. # 1
Thank you for your reply, Toufiq. Unfortunately, it does not have any effect at all. I did paste this code before and after the head (in the template fields) but there is no difference visible. The last menu items are still viewed in the banner and the language flags are still not visible. What can I do?
  1. more than a month ago
  2. Giver
  3. # 2
Hi there, Thanks for your reply. Please provide me the Joomla administrator access via PM. Thanks
  1. more than a month ago
  2. Giver
  3. # 3
Hi Toufiq,

Wow, Now the multi-language flags are visible in the pc view on the iPad AND on the mobile view. The menu items are on the same line in the English and dutch websites as well. This is a huge improvement. Thank you so much. May I ask what you did so I can implement this also on the other website that I am developing?

Only in the Spanish language, the menu items are still taking several lines and therefore, messing up the layout. Enclosed you find the screenshot
Attachments (1)
  1. more than a month ago
  2. Giver
  3. # 4
Hi there,

Thanks for your feedback. There is no way to reduce menu space in the Spanish language version. You need to reduce the menu item text.

-Thanks
  1. more than a month ago
  2. Giver
  3. # 5


There are no replies made for this post yet.
Be one of the first to reply to this post!


This forum is archived

This forum has been archived. Please use JoomShaper official support system.