Home › Forums › Support › Switching from Floats to Flexbox – font issue This topic has 11 replies, 3 voices, and was last updated 3 years, 6 months ago by Leo. Viewing 12 posts - 1 through 12 (of 12 total) Author Posts October 23, 2020 at 3:55 pm #1501835 Gian Hi, I’m switching all my sites from the Float option to Flexbox, but I’ve noticed an issue with the font used, which seems to be thinner and lighter than before. Is it normal? Is it possible to keep the font as it used to be? Thank you in advance, Gianluca October 23, 2020 at 5:21 pm #1501875 LeoStaff Customer Support Hi there, The font shouldn’t change at all. Where can we see the issue? October 23, 2020 at 8:30 pm #1501937 Gian Hi Leo, you can have a look at this site https://www.gianlucaorlandi.io/ which has Flexbox activated and this one https://www.viaggiaregratis.eu/ which has Floats. The font used is the same, but in the first website it looks thinner and lighter. I’m using Chrome. Thank you October 23, 2020 at 8:34 pm #1501942 LeoStaff Customer Support Just tested with Chrome and not seeing any difference at all: https://www.screencast.com/t/8vV4ifTIv https://www.screencast.com/t/6vRt3vU8nxn October 23, 2020 at 8:44 pm #1501945 Gian Flexbox https://imgur.com/a/3ZGfJLA Floats https://imgur.com/a/1GVqFcA Try to zoom the pictures, the difference is minimal but in Floats the font seems thicker. October 24, 2020 at 5:11 am #1502196 DavidStaff Customer Support Hi there, GP 3.0 introduced this CSS: html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } Which is why the typography is ‘finer’. If you can unset that with CSS: html { -webkit-font-smoothing: unset; -moz-osx-font-smoothing: unset; } October 24, 2020 at 9:47 am #1502593 Gian Hi David, It worked, thank you! Another issue I’ve noticed with the switch, is related to the hr tag. I’ve styled it with this CSS: /* hr tag - Horizontal line style */ hr { background-color: #a0d468; width: 20%; height: 2px; } to show the horizontal line in the center of the page, but with Flexbox the line is pushed to the left as you can see here https://imgur.com/a/ATeDIg4 Is there a way to center the hr tag with some CSS? Thank you in advance October 24, 2020 at 10:35 am #1502649 LeoStaff Customer Support Sorry I missed the font issue before! Can you link me to the page where I can see the hr tag issue? October 24, 2020 at 10:37 am #1502652 Gian No problem, Leo. Here’s the page https://www.gianlucaorlandi.io/libri Thanks. October 24, 2020 at 10:52 am #1502664 LeoStaff Customer Support Edit your CSS to this: hr { background-color: #a0d468; width: 20%; height: 2px; margin-left: auto; margin-right: auto; } October 24, 2020 at 10:53 am #1502665 Gian Perfect, thank you ๐ October 24, 2020 at 10:55 am #1502668 LeoStaff Customer Support No problem ๐ Author Posts Viewing 12 posts - 1 through 12 (of 12 total) You must be logged in to reply to this topic. Log In Username: Password: Keep me signed in Log In