[Resolved] Set the lateral bar before the welcome page in mobile version

[Margot]

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.

[David]

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;
  }
}

[Margot]

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

[David]

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;
    }
}

[Margot]

This is perfect, thank you very much !

[David]

You’re welcome

[Author]

Posts