Andrey (azangru) wrote,
Andrey
azangru

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.
Subscribe

  • (no subject)

    A beautiful cartoon on the front page of The Week:

  • (no subject)

    This is just as bad as a brief exchange with a belligerent guest on a regular news show: Six minutes! Six minutes, during which Rand Paul is…

  • (no subject)

    The war on repetitions:

  • Post a new comment

    Error

    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.
  • 0 comments