Sposoby wyrównania checkbox’ów w formularzu
Tworzenie stron internetowych zawiera w sobie wiele możliwości. Także jeśli chodzi o projektowanie i tworzenie formularzy, w których zawarte są pola wyboru. Jak podejść do tego typu formularzy i jak je wykonać, by były przyjazne użytkownikowi? Wyrównanie checkbox’ów i sposoby przedstawię w poniższym, krótkim artykule.
Łukasz
Podziel się artykułem:
Szczypta teorii
W formularzu internetowym bardzo często mamy wymóg zaznaczenia zgody lub możliwość zapamiętania hasła do logowania (nie polecam zaznaczać). Z punktu widzenia użytkownika wygląd takiego elementu w formularzu, w większości przypadków, ma małe znaczenie. Jadnak, gdy widzimy stronę internetową przygotowaną „ze smakiem” zwracamy uwagę także na detale. Takimi detalami mogą być poprawnie pozycjonowane pola do zaznaczania.
Wyrównanie checkbox’ów
Przejdę od razu do konkretów. Jest co najmniej kilka sposobów na prezentację i pozycjonowanie pola wyboru w formularzu. Tworząc nowoczesny layout strony i formularza wypadałoby, aby nasz kod również był nowoczesny.
Oczywiście technika tworzenia to flexbox.
dark
Stworzyłem od razu gotowy przykład na sposoby wyświetlania pól wyboru:
- flex-start – elementy zostaną wyrównane do górnej krawędzi kontenera,
- center – elementy będą wyśrodkowane w pionie,
- baseline – elementy zostaną wyrównane względem linii tekstu.
Powyższy przykład pokazuje 3 typowe sposoby na wyrównanie w pionie elementów wyboru.
Przeczytaj także
Gradienty CSS – omówienie
Gradienty w CSS są szeroko stosowane w wielu miejscach, od tworzenia prostych tła po skomplikowane wzory, takie jak gradienty wielokolorowe.
Jak rozmyć tło w CSS?
Ciekawym rozwiązaniem na stronie internetowej może być element, który zawiera rozmyte tło. Można to uzyskać za pomocą właściwości CSS.
Spis treści w CSS
Istotą każdego spisu treści jest danie konkretnej informacji czytelnikowi, gdzie znajduje się dana zawartość tekstu. W tym artykule dowiesz się, jak stworzyć poprawnie spis treści w CSS, zachowując trzy podstawowe elementy.