Freelancer
Active Member
Hello,
I found a bigger problem with CSS Classes on the Personal Profile page. With XenForo Media Gallery (XFMG) installed you have three tabs on every profile page. "Groups", "Media", "Albums" (with users that have pictures and albums).
Now comes the problem: When you switch back and forth between the tabs, the initial tab content is displayed correct but once you click the next of the three tabs and then back you will experience that the layout is messed up. The Social Groups Grid Columns are displayed smaller (more narrow) than in the initial layout since there are multiple similar CSS classes that influence each other.
I analyzed the code and found a conflict with the .gridCol and associated classes. In XFMG and XFRM you have the .gridCol manage the distribution of Containers over the layout with the formula width: {xen:calc '(100 / @defaultPerRow) - 2'}%; while in Social Groups this is missing at that place but is handled by .grid-elements .grid-element: {xen:calc '(100 / @Teams_defaultPerRow) - 2'}%;. And there is the conflict: Since .gridCol and .grid-elements .grid-element are both loaded and present on the Personal Profile page, both conflict with each other, breaking the layout (making the Group Boxes more narrow than initially).
Unfortunately I wasn't able to copy the template elements and classes from XFMG to Social Groups, I tried but it messed it up even more.
And of course I tested it in the XF default theme, so it is not a custom problem.
Hopefully it was understandable.
I found a bigger problem with CSS Classes on the Personal Profile page. With XenForo Media Gallery (XFMG) installed you have three tabs on every profile page. "Groups", "Media", "Albums" (with users that have pictures and albums).
Now comes the problem: When you switch back and forth between the tabs, the initial tab content is displayed correct but once you click the next of the three tabs and then back you will experience that the layout is messed up. The Social Groups Grid Columns are displayed smaller (more narrow) than in the initial layout since there are multiple similar CSS classes that influence each other.
I analyzed the code and found a conflict with the .gridCol and associated classes. In XFMG and XFRM you have the .gridCol manage the distribution of Containers over the layout with the formula width: {xen:calc '(100 / @defaultPerRow) - 2'}%; while in Social Groups this is missing at that place but is handled by .grid-elements .grid-element: {xen:calc '(100 / @Teams_defaultPerRow) - 2'}%;. And there is the conflict: Since .gridCol and .grid-elements .grid-element are both loaded and present on the Personal Profile page, both conflict with each other, breaking the layout (making the Group Boxes more narrow than initially).
Unfortunately I wasn't able to copy the template elements and classes from XFMG to Social Groups, I tried but it messed it up even more.
And of course I tested it in the XF default theme, so it is not a custom problem.
Hopefully it was understandable.
