📜 ⬆️ ⬇️

Mozilla Firefox. Problems of adaptive layout (a bug that almost quarreled the company)

It is recommended to read the layout, as well as their leaders. It is not a guide to any action.

Today is February 13th, 17th. The story began 3 days ago. Actually the problem appeared next. There is a carousel (this is a type of slider), the maker of the R & K company received a request that the carousel is not adaptive, i.e. does not shrink as expected, when compressing the browser window to the width. The bug is detected in Firefox v50.1.0 32-bit, Win7 32-bit. At the same time, the next day, a strange phone call from the customer appeared, with a message that everything was working, and thanks for the quick response. Since No one watched the layout at all; people scratched their turnips in perplexity and parted. Two days later, the customer called again, and already violently / heart-rending / wildly / fiercely, he began to shout that the layout was again not adaptive, and was not squeezed into the browser window when the browser was compressed. It was then that the people became thoughtful and began to twist the layout.

index.html <!DOCTYPE html> <html><head> <meta encoding="utf-8" /> <link rel="stylesheet" href="style.css" /> </head><body> <div> <label><input type="radio" name="name" checked="checked" /></label> <label><input type="radio" name="name" /><img src="1.jpg" /></label> <label><input type="radio" name="name" /><img src="2.jpg" /></label> </div> </body></html> 

 style.css * {margin: 0; padding: 0; font-size: 0; } /*   */ div { margin: 20px auto; /*    */ border: 1px solid royalblue; /*     */ /*display: inline-block;   div,     */ max-width: 450px; /* 300, 400, 450, 600,    */ white-space: nowrap; /*       */ /*overflow: hidden;   overflow,     */ } input { /*display: none;   display,     */ } img { width: 100%; /*    */ } 

Of course, all the excess is drunk for tests. What would be clear was the meaning of the problem. So, the detected problem of “adaptive layout” is the following:

We impose, impose, for example, what is above, run again in the above Firefox browser. We see the following picture, everything is as expected, for example, like this.
')

Squeezing the window, of course, “adaptive layout” presses the image, we get this.


Everything is good? And it was not there ... We go to drink tea, smoke, come back, open Yandex, read news (mail, Habr, rutub, etc.), open to look at our layout, and get this in amazement.


Now get the people right. People are people. Everything is impossible to take into account. In the world of software, everything is taken into account - all the more impossible. The following situation has developed. The client opened the page in one tab, squeezed the browser, and got what he wanted. The next day, he opened the page with the second tab, and the layout was split. At the same time, the layout designer didn’t notice the tabs in exactly the same way - he opened them differently and got different results. Nobody paid attention to the number of tabs. It got to the point where they began to raise a pure Vendu, look there, started digging bug reports on Mozilla forums, started looking for strange width / max-width selectors and taking very enchanting and strange actions, which I’m ashamed to write about, but for the number of tabs again and again no one paid attention. Moreover, for three hours nobody was able to recreate the bug, because they opened a test page on a clean browser without tabs. Were simply amazed that the bug disappeared by itself, but of course, it was worth opening a tab page, and with certain ones, the bug crawled out. For a day, people had the nicest batthurte, which I had never seen in my life, flavored with heart-rending screams of a client. Of course, people began to lose their nerves a little bit, and it almost went as far as frank massacre. Further, there is no point in telling the story, but you can guess what kind of situations can happen on your own.

Please, in the world of software, be more attentive and patient. This applies to all without exception. Both to performers, and to heads. With customers to take in addition to money, of course, nothing, and they can be forgiven.

PS: I have nothing to do with typesetters. I made it 10 years ago, thank God, I quickly got off of this indecent matter. I got myself this problem by a phone call from a friend who broke his head, solving this problem. The bug was successfully recreated, the layout above is mine. Imposition test, not production, not in one eye. Specially called another familiar layout maker, hears about this bug for the first time.

Source: https://habr.com/ru/post/321966/


All Articles