Support Online : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Menu below article on mobile view

Featured Lock Resolved Issue
Hi,

How to make menu left below of the article on mobile view ?

16 Answers

Toufiq - Staff

More than a month ago #Permalink
Hi there,

Added this code & now working fine.


@media screen and (max-width: 768px) and (min-width: 320px) {
.view-article, .view-form, .flex-col .row {
display: flex;
flex-direction: column-reverse;
}
}


-Thanks

Toufiq - Staff

More than a month ago #Permalink
Hi, Please share a screenshot that you want to do exactly? Thanks

Jun Frianto Purba

More than a month ago #Permalink
Hi, thanks for repply, screenshoot attached.

Attachments (1)

  • menu-mobile.png
    menu-mobile.png 95 KB

Toufiq - Staff

More than a month ago #Permalink
Hi, Share your site url and do you wanna off-canvas menu like as screenshot? Please let me know. Thanks

Jun Frianto Purba

More than a month ago #Permalink
Hi, Share your site url and do you wanna off-canvas menu like as screenshot? Please let me know. Thanks


Hi Taufiq, my url is http://www.smsmasking.co.id, as we see the screenshoot on mobile view, the left menu go to the top of the article,
i want the menu go to below of the article

Toufiq - Staff

More than a month ago #Permalink
Hi,

Please following the instruction.

1. Add a CSS class inside template layout row settings
https://prnt.sc/hg7bak
2. Add this CSS code inside your custom.css file

@media only screen and (max-width : 320px) {
.flex-col .row {
display: flex;
flex-direction: column-reverse;
}
}


-Thanks

Jun Frianto Purba

More than a month ago #Permalink
Hi,

Please following the instruction.

1. Add a CSS class inside template layout row settings
https://prnt.sc/hg7bak
2. Add this CSS code inside your custom.css file

@media only screen and (max-width : 320px) {
.flex-col .row {
display: flex;
flex-direction: column-reverse;
}
}


-Thanks


Hi, this is not working for me,
result like a screenshoot

Attachments (1)

  • notwork.png
    notwork.png 52.9 KB

Toufiq - Staff

More than a month ago #Permalink
Hi, Please send me the administrator access via pm. Thanks

Jun Frianto Purba

More than a month ago #Permalink
Hi, Please send me the administrator access via pm. Thanks


hi, is there solution for this ?

Toufiq - Staff

More than a month ago #Permalink
Hi, Please send me the administrator access via pm. Thanks


hi, is there solution for this ?


Hi, Please send me the administrator access via pm. Thanks

Jun Frianto Purba

More than a month ago #Permalink
Hi, Please send me the administrator access via pm. Thanks


hi, is there solution for this ?


Hi, Please send me the administrator access via pm. Thanks


Administrator access has been sent

Jun Frianto Purba

More than a month ago #Permalink
Hi
menu is still above content. all I want is a menu under content.

Attachments (1)

  • Screenshot_20180717-073324_Chrome.jpg
    Screenshot_20180717-073324_Chrome.jpg 255.6 KB

Toufiq - Staff

More than a month ago #Permalink
Hi there,

Updated code and now working fine.

-Thanks

Jun Frianto Purba

More than a month ago #Permalink
Hi toufiq, its SOLVED.

Thanks for your support

Toufiq - Staff

More than a month ago #Permalink
Hi toufiq, its SOLVED.

Thanks for your support


Hi, You are most welcome & Thanks


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

Leaderboard (30 days)

Paul Frankowski

Paul Frankowski

Total Accepted Answers: 107
Sifat

Sifat

Total Accepted Answers: 62
Toufiq

Toufiq

Total Accepted Answers: 47
Mehtaz Afsana Borsha

Mehtaz Afsana Borsha

Total Accepted Answers: 20
Rashida Rahman

Rashida Rahman

Total Accepted Answers: 12

118

Templates

303288

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us