Small styling issues that need attention

pixelgrade / nova-blocks

A collection of design-driven WordPress editor blocks committed to making your site shine like a newborn star 💫

https://pixelgrade.com/plugins/nova-blocks/

GNU General Public License v3.0

65 stars 4 forks source link

Small styling issues that need attention #283

Closed alinclamba closed 3 years ago

alinclamba commented 3 years ago

There seems to be a line between the 1st block and the 2nd block (under the arrow); also, there's a thin white line in the button (only for the mobile version).

Screenshot from the site (https://infuse.onefifthmedia.com.au/):

rosa-nova_buttons

Notes:

pc: windows 10 (see a line under arrow)
phone: android (see button problem and a borderline under arrow)
browser: chrome
there's no such line under the arrow when I use Mac.

madalingorbanescu commented 3 years ago

Hey @alinclamba,

This issue seems to be specific to Rosa2, not Nova Blocks, however, I wouldn't label it as an issue.

This is happening because we are using fluid typography and spacing. We are heavily using calc(), and the returned result can be a number like 17.3251.

The problem arises from a different approach for subpixels calculations between browsers, this is why on some browsers the lines are visible, while on some browsers there are no lines.