I was having a torrid time trying to work out why sometimes my Genesis site had a much bigger font that it should have done. It only occurred in Chrome, and even more bizarrely, it was often OK the first time you viewed a a page, but only occurred when you refreshed it!
It turns out to be a chrome bug, and the work around is very simple, as described in this stackoverflow question. It’s caused because Genesis child themes tend to use the rem unit of measurements on the body tag. The rem unit is supposed to stop font-sizes compounding and getting out of control, but for some reason Chrome trips over when there’s an rem unit on the body tag. The good news is that you don’t need a rem unit on the body tag, because ems are only a problem when you have lots of them. Having one em unit is fine.
So if you’re affected by this bug, just look for the body tag in your CSS file, and change the font-size unit from rem to em – like this:
From this:
body {
color: #666;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
font-weight: 300;
line-height: 1.625;
}To this:
body {
color: #666;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 16px;
font-size: 1.6em;
font-weight: 300;
line-height: 1.625;
}