Archived topic

Set the lateral bar before the welcome page in mobile version

5 replies · Started by Margot on January 14, 2021

Viewing posts 1–6 of 6

January 14, 2021 at 2:50 am #1618154

Hello there,

I would like to put the logos of my lateral bar before the text of my welcome page in my website's mobile version. I do not know how to do that. For the moment, my lateral bar is after all the text in the mobile version and it is important to me that people who go to my website see right away my logos.

Could you help me please ?

Thanks in advance.

January 14, 2021 at 5:14 am #1618282

Hi there,

try this CSS:

@media(max-width: 768px) {
  .site-content {
    display: flex;
    flex-direction: column-reverse;
  }

  .inside-left-sidebar figure {
    width: auto !important;
    text-align: center;
  }
}

January 15, 2021 at 1:51 am #1619607

It worked, thank you very much! Can I exclude pages from this layout ? I would like to have my lateral bar first in my welcome page and my "who are we" page in mobile version, but not in the others...

Thank you in advance,

Margot

January 15, 2021 at 5:49 am #1619857

Of course, change the CSS to this so it only applies to the home and the who we are page:

@media(max-width: 768px) {

    .home .site-content,
    .page-id-11494 .site-content {
        display: flex;
        flex-direction: column-reverse;
    }

    .home .inside-left-sidebar figure,
    .page-id-11494 .inside-left-sidebar figure {
        width: auto !important;
        text-align: center;
    }
}

January 15, 2021 at 6:56 am #1620099

This is perfect, thank you very much !

January 15, 2021 at 8:03 am #1620205

You're welcome

This archived topic is closed to new replies.

Start building better websites today.