Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • October 10, 2016 at 2:06 pm #697330
    Sadegh

    Hey Kriesi Team,

    – Mobile mode menu style of our website, looks fine, like below image:
    .

    – I want to have same menu style in tablet mode as well.
    Right now, it shows wrongly like this:
    .

    Regards,
    Sadegh

    October 10, 2016 at 2:10 pm #697335
    Yigit

    Hi Sadegh!

    Please add following code to Quick CSS 

    @media only screen and (max-width: 990px) and (min-width: 769px) {
#advanced_menu_toggle {
    background: white!important;
    right: 50px;
}}

    Best regards,
    Yigit

    October 10, 2016 at 2:34 pm #697357
    Sadegh

    Hey Yigit,

    Thanks a lot for the great help, it works great.
    And may I know how can I make the Mobile menu style from RTL mode (link) exactly like the English mode?
    Right now, it looks like this:
    .

    Regards,
    Sadegh

    October 10, 2016 at 2:40 pm #697362
    Yigit

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (max-width: 990px) {
.rtl #advanced_menu_toggle {
    top: 100px;
    right: 0;
}}

    Best regards,
    Yigit

    October 10, 2016 at 3:01 pm #697375
    Sadegh

    Hey Yigit,

    That was great, but it somehow made the Menu box (in RTL mode) sticks to the right of the page:
    (in tablet mode)
    .

    Regards,
    Sadegh

    October 10, 2016 at 3:08 pm #697384
    Yigit

    Hey!

    Please change the code to following one 

    @media only screen and (max-width: 990px) and (min-width: 768px) {
.rtl #advanced_menu_toggle {
    top: 100px;
    right: 50px;
}}
@media only screen and (max-width: 767px) {
.rtl #advanced_menu_toggle {
    right: 0;
}}

    Cheers!
    Yigit

    October 10, 2016 at 3:21 pm #697397
    Sadegh

    Hi again,

    Thanks a lot as always, but now the menu box in mobile mode seems to have problem :)
    (in RTL mode)
    http://sl.uploads.im/d/u7k6T.png

    October 10, 2016 at 3:23 pm #697399
    Yigit

    Hey!

    Sorry about that, please use following one :) 

    @media only screen and (max-width: 990px) and (min-width: 768px) {
.rtl #advanced_menu_toggle {
    top: 100px;
    right: 50px;
}}
@media only screen and (max-width: 767px) {
.rtl #advanced_menu_toggle {
    right: 0;
    top: 100px; 
}}

    Cheers!
    Yigit

    • This reply was modified 8 years, 1 month ago by Yigit.
    October 10, 2016 at 3:29 pm #697402
    Sadegh

    Thanks a lot Yigit as being helpful like all the time :)

    (you may now close the thread please)

    Kind regards,
    Sadegh

    October 10, 2016 at 3:31 pm #697403
    Yigit

    Hi!

    You are welcome Sadegh, always happy to help :)

    Regards,
    Yigit

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Tablet mode and Mobile mode style’ is closed to new replies.