1. Tralala
  2. Sherlock Holmes
  3. Commercial Templates
  4. Saturday, 16 April 2022
  5.  Subscribe via email
Hi Ciaran,

Working with Nina in J4, the modules in side-column 2 doesn't come before (above) component in mobile view. Although I choosed in template > General > Responsive Options > Sidecolumn Positioning for 'Before Component'.

The (old) solution in https://www.joomla51.com/forum/sidecolumn-positioning-not-working-properly doesn't work.
Your elswhere given option @media only screen and (max-width: 840px) { .sidecol_b { order: 0 !important;} forces the right-column modules to the left – this is not what I want.

How to fix this?
References
  1. https://www.demo1.ict4free.nl/activiteiten/fietsen
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

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

.sidecol_a, .sidecol_b {
    order: 0;
}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ciaran,

Thanks, but sorry, this is not what I am looking for.
My wish is not 'sidecolumn 2 left of ('before') component' (than I should choose placing in sidecolum 1), but 'above content'. That's what is meant by 'before', isn't it?
  1. more than a month ago
  2. Commercial Templates
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ciaran,

Your suggestion did not meet my needs, BUT you gave me an idea.
I added this code:

@media only screen and (max-width: 820px) {
    #main {
        display: flex;
        flex-direction: column;
    }
    .sidecol_b, .main-content {
        order: 0;
    }
}

(820 isn't essential)
and that did the job.
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Could you try the following instead...

@media only screen and (max-width: 820px) {
    .sidecol_a, .sidecol_b {
        order: 0;
    }
}


There appears to some CSS affecting this feature. If the above is not the correct solution for you, may I suggest sending temporary administration access to your Joomla installation to info@joomla51.com and we will examine this issue further. For our reference please paste a link to this post in your email.

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 4
Accepted Answer Pending Moderation
0
Votes
Undo
With this given code the content of the column does come first, but in iPad portrait view the column is too narrow.
I choose for this code now:

@media only screen and (max-width: 1010px) {
    #main {display: flex; flex-direction: column; }
    .sidecol_b, .main-content { order: 0; width: 100%; }
} 

So it needed the addition of "width: 100%".
  1. more than a month ago
  2. Commercial Templates
  3. # 5
  • Page :
  • 1


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