Andrey (azangru) wrote,

Lebedev’s agency announces a site they built for a client:

If viewed on a non-mac computer (macs hide scrollbars by default), one can see the horizontal scrollbar in the bottom of the page:

At first I thought it’s because the developer set the width of one of the main containers to 100vw — because I myself used to do that. 100vw, however, usually (not sure if always, in all browsers) will return the total width of the viewport, including the width of the vertical scrollbar, which means that if the page is tall enough to show the vertical scrollbar, 100vw will make its inner width greater than the visible inner width of the page, and a horizontal bar will appear. Which makes 100vw a pretty useless CSS rule.

But no, it turned out to be sillier than that. It’s the stupid top cookie banner that extends beyond the width of the page:

And the reason it does so is because they are using negative 15-pixel margins on it to override 15-pixel paddings inherited from what they use for their grid system:

The moral of the story is: CSS is tough. And you can bet the developer used a mac, because macs hide this kind of problem by not showing scrollbars by default.

  • (no subject)

    On the dreadful state of the style of modern Russian communication. "There is no alternative", writes an author, and then immediately outlines an…

  • Via Twitter

    Via a tweet, but I thought I'd get my own copy. A beautiful illustration of how a caption totally misrepresents what's been captured in the photo.…

  • (no subject)

    Here's an extract from Uncle Bob's book Clean Agile. Although he has fallen out of grace with the champions of social justice, the sentiment…

  • Post a new comment


    default userpic
    When you submit the form an invisible reCAPTCHA check will be performed.
    You must follow the Privacy Policy and Google Terms of use.