Rem, em – jednostki miary w css



Przyznam, że rzadko korzystam z takich jednostek miary jak rem i em. Zazwyczaj używam pikseli (px), bo jakoś łatwiej mi skojarzyć, jaki rozmiar będzie posiadać dany element.

Jednostki rem i em, w przypadku czcionek, mają jednak jedną przewagę nad pikselami – mogą być ustawione w korelacji do wielkości czcionki rodzica (em) lub roota (najczęściej jest nim element <html> – rem). Daje to możliwość manimulowania rozmiarami dla wielu elementów na raz. Domyślna wartość rozmiaru czcionki dla roota to zazwyczaj 16px (ale to zależy od przeglądarki).

Read More Rem, em – jednostki miary w css

Responsive images in HTML5, using srcset // Responsywne obrazki dla różnych ekranów w HTML5



Często spotykanym problemem przy projektowaniu stron internetowych są zdjęcia. Wyświetlenie większego zdjęcia na większym ekranie to lepsze wrażenia dla użytkownika, ale już wyświetlanie dużego zdjęcia na małym ekranie, np. na telefonie, może niepotrzebnie opóźnić ładowanie strony.

Dlatego dobrym rozwiązaniem jest “serwowanie” zdjęć o odpowiedniej wielkości i wadze dla różnych ekranów.

Read More Responsive images in HTML5, using srcset // Responsywne obrazki dla różnych ekranów w HTML5

How to set div to 100% window height? // Jak ustawić div-a na 100% wysokości okna?



Tworząc strony internetowe zdarza się, że chcemy, aby div z określonymi informacjami zajmował całą wysokość okna, niezależnie od wysokości tego okna. Wiadomo, że ustawiając wysokość dziecka na 100% zajmuje ono całą przestrzeń swojego rodzica. Zatem aby div zajmował całą wysokość okna, wszyscy jego rodzice muszą także mieć ustawioną taką wysokość.

Read More How to set div to 100% window height? // Jak ustawić div-a na 100% wysokości okna?

How to center div horizontally and vertically in css // Jak wycentrować div-a w poziomie pionie używając css



Problem centrowania diva lub tekstu jest dość powszechny i sama niejednokrotnie musiałam poświęcić na jego “naprawienie” więcej czasu niż bym chciała. Czasem sytuacja jest prosta i użycie jednej z podstawowych metod, jak margin: 0 auto rozwiązuje sprawę, a czasem trzeba trochę więcej pogłówkować. Dlatego poniżej przedstawiam kilka przydatnych metod, które możesz użyć w zależności od Twoich potrzeb.

Read More How to center div horizontally and vertically in css // Jak wycentrować div-a w poziomie pionie używając css