Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Safari – 34% + 33% + 33% doesn’t equal 100%

  • This topic is empty.
Viewing 3 posts - 16 through 18 (of 18 total)
  • Author
    Posts
  • #136363
    iknowdavehouse
    Participant

    Thanks, I’ll have a look at that. My original query of why a 34% + 2x 33% panels can confuse a browser as they are whole numbers.

    It’s forgivable on Safari desktop but it’s more apparent on iPhone.

    Thanks

    #136368
    Merri
    Participant

    Just for some additional info, using full percentages doesn’t change the problem with rounding to full pixels. Say we use the same 101px container example:

    – 101 * 0.34 = 34.34 = 34px
    – 101 * 0.33 = 34.33 = 33px
    – 34 + 33 + 33 = 100px

    Or 102px container:

    – 102 * 0.34 = 34.68 = 34px
    – 102 * 0.33 = 33.66 = 33px
    – 35 + 34 + 34 = 100px

    Proof: http://codepen.io/Merri/pen/cCBzg

    So while those percentages can get closer than using 33.333% it still doesn’t solve the problem.

    #136371
    iknowdavehouse
    Participant

    Thanks for the detailed response / explanation. The site I’m actually working on has quite a lot of additional styles to factor in but I can certainly use a couple of the suggested methods.

    Generally I was just surprised this was happening and wondered if I was doing something wrong…

    Thanks again

Viewing 3 posts - 16 through 18 (of 18 total)
  • The forum ‘CSS’ is closed to new topics and replies.