[SendMeAnAngel]

Mam taki dylemat. Większość tekstu ma być 12px, nagłówki 16px, menu 14px, etykiety 10px, marginesy 5px, 10px, 20px. Czy zostawić "rem" taki jak domyślnie w przeglądarkach 16px, czy zbić do 12px lub 10px?

html {font-size: 16px} /*browser default*/
body {font-size: 0.75rem} /*12px tekst*/

Argumenty za:

1. 1rem = 16px bo tak jest domyślnie w przeglądarkach (na wypadek jeśli główny CSS się nie załaduje, a komponenty mają własne CSS-y, gdzie są zdefiniowane marginesy i wielkości tekstu z rem-ach)
2. 1rem = 12px bo taki rozmiar ma tekst bazowy
3. 1rem = 10px bo będzie łatwiej przeliczać wielkości z px

Czy są jakieś rekomendacje?

#webdev #frontend #webdesign #css

[Makurise]

@SendMeAnAngel: Już pomijając, że 12px dla większości tekstu na stronie to trochę mało, to nie ma to żadnego znaczenia. Żadnego. Wymyśliłeś sobie problem do rozwiązania tam, gdzie nie ma problemu. Którą byś opcję nie wybrał - efekt końcowy będzie dokładnie taki sam.

[Makurise]

na wypadek jeśli główny CSS się nie załaduje

@SendMeAnAngel: Jak się główny CSS nie załaduje, to i tak pół strony będzie rozwalone, a czcionka będzie najmniejszym problemem ( ͡° ͜ʖ ͡°)

[SendMeAnAngel]

@Makurise: Bo być może rozmiary powinny być w jednym miejscu ustalone (jako zmienne SASS lub zmienne CSS) i wtedy eksperymentowanie nie wymaga zmiany wielkości we wszystkich plikach. Do tego spróbuję doprowadzić.

12px to się kiedyś ustawiało za czasów rozdzielczości 1024x768 i bardzo niewygodnie czytało się długie ściany tekstu. Problem w tym, że każda czcionka wygląda inaczej, np. na Wykopie jest 14px i już 16px wydaje się za dużo.

Nie wiem,

[kubako]

ale może u niego całkiem inaczej to wygląda.

@SendMeAnAngel: generalnie u każdego inaczej wygląda. Ja np oglądam wykop w powiększeniu 140%

[SendMeAnAngel]

@Makurise: ChatGPT podpowiedział coś takiego

$use-rem: true;
$base: 12px;
$base-large-screen: