Site icon Catch Themes

Bug with non-standard browser default font size

If the default font size of the browser is not 16px (or if the minimum font size is greater than 10px), some bad looking things happen. This can be reproduced with Catch Everest 1.1.2 by going to the live preview with such settings. (For a larger default font size, white bars start to appear along the slider for large resolutions, which looks ugly. Moreover a horizontal scrollbar may occur. For a smaller default font size, the sidebar can be forced to be diagonally below the main content area.) The problem is that the width of #primary and #secondary are set in pixels, while the width of .site and the padding of .container are set in rem-units. These do not match up when 1rem is not 10px. Changing these values to rem seems suboptimal as the responsive CSS uses pixel-based sizes of devices. Hence I think the most sensible thing is to change these values to pixels. This I did in a child theme. In child/functions.php: http://8f6335cf4c8db481.paste.se/ In child/style.css: http://637bc77783a56262.paste.se/ In child/css/responsive.css: http://92e07d4381ab5073.paste.se/ Let's hope I didn't make any typoes in those pastes. It would be nice if this or a different fix could land in the next version.
Exit mobile version