FEATUREDFrontend

Čo je dôležité 5

Päť najzajímavejších vecí o CSS z posledných týždňov, novinky z Chrome 145 a všetko, co ste mohli zmeškať. Plus prečo programujete len 4 hodiny denne a ako správne používať breakpointy.

GUY Team
5 min čítania
Čo je dôležité 5

Toto vydanie What's !important je venované našim priateľom v Spojenom kráľovstve (teda mne), ktorí momentálne zažívajú veľmi ubohaté 43-dňové pršanie. Predstavujeme: päť najzajímavejších vecí o CSS z posledných dvoch týždňov. Plus najnovšie funkcie z Chrome 145 a všetko ostatné, čo ste mohli zmeškať. TL;DR: veľa obsahu, ale aj veľa dažďa.

Prečo môžete programovať len 4 hodiny denne

Nebojte sa, aj tak programujete len 52 minút denne.

Dr. Milan Milanović hovorí o ničivom vplyve stretnutí, emailov, Slacku a prerušení a o tom, čo môžete vy/váš manažér urobiť. Tento článok je skutočným otváračom očí s množstvom šokujúcich (ale nie prekvapujúcich) štatistík o flow stave priemerného vývojára.

Prečo by ste nemali prepínať na menšie breakpointy príliš skoro

Ahmad Shadeed vysvetľuje prečo by ste nemali prepínať na menšie responzívne breakpointy príliš skoro, s príkladmi webových stránok, ktoré to urobili a scenármi, v ktorých používatelia môžu na tieto breakpointy natrafiť.

Zdroj: Ahmad Shadeed.

Ako lenivo načítať iframy nad zlomom

loading=lazy funguje len pre prvky mimo obrazovky, takže Stefan Bauer predvádza šikovný trik pre lenivé načítanie <iframe> nad zlomom pomocou <details>.

Ako vytvoriť opakujúce sa corner-shape pozadia

Preethi Sam nám ukazuje ako použiť corner-shape v <svg>, ktoré sú potom použité ako opakujúce sa backgroundy. Robil som vlastné experimenty s corner-shape, ale toto je úžasné a určite niečo, čo som nezváži.

The CSS Selection (edícia 2026)

Čo webový vývojári skutočne robia s CSS? Zatiaľ čo iné výskumné štúdie sa zameriavajú na funkcie, The CSS Selection (edícia 2026) sa sústreďuje na CSS vzory a techniky. Je to veľmi zaujímavé čítanie a určite sa raz alebo dvakrát zasmeješ, obzvlášť keď objavíš rôzne preklepy pre !important.

Tu sú niektoré z mojich obľúbených:

  • !IMPORTANT: príliš hlasné
  • !impotant: príliš veľa informácií
  • !i: to je len lenivosť
  • !imPORTANT: vynikajúca výslovnosť
  • !importantl: ach, tak blízko…

Funkcie Chrome a rýchle tipy, ktoré ste mohli zmeškať

Chrome 145 bol vydaný pred pár dňami a ako vždy sme zdieľali niektoré rýchle tipy počas týždňa. Môžete ich zachytiť v bočnom paneli na domovskej stránke, takže sa pokojne zastavte, ak ste niekedy v okolí.

Náhodou väčšina rýchlych tipov súvisela s aktualizáciou Chrome nejakým způsobom, takže zhrniem všetko spolu:

  • text-justify, ktorý môžete kombinovať s text-align: justify na špecifikovanie, či chcete upraviť medzery medzi slovami (text-justify: inter-word) alebo medzery medzi písmenami (text-justify: inter-character), aby bol text zarovnaný. Geoff o tom písal ešte v roku 2017, keď to podporoval len Firefox (tak nejako…), takže podľa môjho výpočtu by to Safari malo podporovať do roku 2035. Takže nie v tejto dekáde, ale pred GTA 6. Len žartujem… (myslím).
  • Hovoríme o medzerách medzi slovami a písmenami, word-spacing a letter-spacing teraz akceptujú % jednotky, ako v Safari a Firefoxe.
  • Podobne, overscroll-behavior teraz funguje pre nekoreňové scroll kontajnery, ako v Safari a Firefoxe. Varovanie WebDev RedFoxa o overscroll-behavior neprišlo v lepšom čase.
  • column-wrap a column-height pre lepšie viacstĺpcové rozloženia sú teraz tiež tu, ale bohužiaľ len v Chrome.
  • To platí aj pre prispôsobiteľný <select>, pravdepodobne najvzrušujúcejšia funkcia na tomto zozname. Ako som zdieľal skôr v týždni, Adam Argyle úžasne zredukoval túto prekvapivo zložitú funkciu na jednoduchý prehľad, ktorý je extrémne ľahko pochopiteľný.
  • Pozerajúc sa trochu viac do budúcnosti, zdá sa, že nakoniec budeme môcť mať viacero orámovania a obrysov na jednom prvku ako aj border-shape, ako to predviedli Dr. Lea Verou a Una Kravets.

Dovtedy!

webdizajncsschromebreakpointyvykon

Nenechajte si ujsť žiadny článok

Prihláste sa na odber newslettera a dostávajte najnovšie tipy a trendy priamo do emailu.