July 30, 2021 at 10:16 am
Hello all.
With people having computers with HD and FHD resolution, some of witch with 150% zoom, websites built with fixed pixel width can become a challenge, with some users complaining of a too big layout (no side margins) and others complaining of the opposite.
The simple solution is having a fluid layout, say 75% of desktop width so it looks ok for everybody. Kadence theme allows to choose that, either by “em” or by “rem”.
The problem is that the kadence blocks row layouts, set to “Content Max Width Inherit from Theme” that worked fine with the fixed layout stop working properly, expanding to the full width of the screen. And manually changing them is no solution, since the units used (“%” and “VW”) are different from the theme, hence causing jagged layouts.
Standard WP content and rows work OK and fit to the variable width, it’s just the row layout that acts strangely.
Anyone has a suggestion of some CSS to solve this?
Also, is there any documentation on the fluid layouts calculations in kadence? What does “em” and “rem” relate to? Screen resolution? Body text size?
Thanks in advance.