How To - Question | JoomShaper

How To

Laurent

Laurent

Helix Framework 1 week ago

Hi,

From mobile view, article details page layout not good for rating and share DIV See here : https://prnt.sc/26513yz How can I change layout to display social share below rating stars (only fro mobile view)?

Thanks L.

0
11 Answers
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 1 week ago

Hi there!

Would you please give me your site URL her, kindly?

Best Regards

0
Laurent
Laurent
Accepted Answer
1 week ago

added on Hidden Content area

0
Laurent
Laurent
Accepted Answer
1 week ago

any news ?

0
Laurent
Laurent
Accepted Answer
5 days ago

any news please?

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 5 days ago

Hi there!

Sorry for the delayed response!

Please use the following media query in your custom.css file to resolve the alignment issue for smaller device resolutions:

@media (max-width: 575px){
body.com-content.view-article .article-ratings-social-share.d-flex.justify-content-end {
    flex-direction: column;
}
}

It will look like this then: https://prnt.sc/26crg4p

Please check and let me know if this is okay for you!

Best Regards

0
Laurent
Laurent
Accepted Answer
5 days ago

works fine thank you, but from mobile layout is not correct see here : https://prnt.sc/26cto5t how to put these lines correctly?

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 4 days ago

You are welcome.

Which device resolution you are trying, please?

0
Laurent
Laurent
Accepted Answer
4 days ago

I don't know this is from my smartphone (huawaei P20)

0
Laurent
Laurent
Accepted Answer
3 days ago

any idea?

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 2 days ago

Hi,

Please try this:

@media (max-width: 575px){
body.com-content.view-article .article-ratings-social-share.d-flex.justify-content-end, .article-ratings {
    flex-direction: column;
}
.article-social-share {
    float: left;
}
}

Best Regards

0
Laurent
Laurent
Accepted Answer
1 day ago

looks better, just one more detail to move stars to left :

see here : https://prnt.sc/26e9t5j

0