Recent
Categories
View Replies (4)

Keep modules inline on mobile

0
Votes
Undo
  1. dy87chf
    dy87chf
  2. Sherlock Holmes
  3. Commercial Templates
  4. Tuesday, 04 April 2023
  5.  Subscribe via email
I am using the Layla theme and would like to keep the 2 modules I have in the header-2 position from stacking on top of each other on mobile. I tried adding display: inline-block to the divs of the 2 modules but that did not fix the issue.
Responses (4)
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Would you have a URL to an example of your deaher modules?

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 1
dy87chf
dy87chf
Sherlock Holmes
Accepted Answer Pending Moderation
0
Votes
Undo
Sorry, here you go:

https://www.sandwichpld.org/home-v2

There are 2 items in the header-2 area - the library hours and the social media icons. I tried placing one in header-1 and the other in header-2, but they still stack on mobile devices.
  1. more than a month ago
  2. Commercial Templates
  3. # 2
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Thank you

To amend try adding the following to the Custom CSS field of your templates parameters (Extensions -> Templates -> [YourTemplateStyle] -> Custom CSS)....

@media only screen and (max-width: 440px) {

    .header-2 {

        flex-direction: row;

        margin: 0;

        padding: 0 5px;

    }

}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 3
dy87chf
dy87chf
Sherlock Holmes
Accepted Answer Pending Moderation
0
Votes
Undo
Perfect, thank you!
  1. more than a month ago
  2. Commercial Templates
  3. # 4
  • Page :
  • 1


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