Pytania dotyczące paru podstaw front-endu

pytanie zadane 27 sierpnia 2018 w HTML i CSS przez Elemental Początkujący (370 p.)
edycja 27 sierpnia 2018 przez Elemental

Siemka wszystkim! Od jakiegoś czasu uczę się Frontendu ale nie wiem czy robię to poprawnie dlatego mam do was parę pytań ^^,

1.Stworzyłem nawigację. Po lewej logo po prawej menu. Czy użycie float left dla loga i float right dla menu jest poprawne? Czy lepiej uzyc flexa lub margin auto?

2. Nawigacja jest jako lista z inline block. Usunąłem dla niej margin i dałem padding top i bottom. Celem tego była stworzenie bordera który podświetla zakładkę i jest zrównany z górą paska. Czy lepiej do tego użyć display inline?

3. Jak wyrównać logo do listy? Użyć do tego padding, line-height czy pozycję relatywną?

4. Header zajmuje całą wysokość ekranu. Jak na nim wyrównać tytuł? Użyć pozycji relative / absolute, margin-top. dispay table, flex ?

5. Elementy w nawigacją będą miały odstęp od lewej i prawej strony ekrany. Dać do w div'a z szerokością np. 90% a następnie nadać temu margin: 0 auto; czy jednak lepiej nadać padding-left: 15px i padding-right: 15px ?

6. Widziałem poradniki, gdzie prowadzący umieszczał logo jako img a w innych jako background image wraz z text-indent. Który sposób lepszy?

Przepraszam za głupie pytania, ale chciałbym się nauczyć robić poprawnie proste strony ^^,

komentarz 27 sierpnia 2018 przez pablop76 VIP (123,180 p.)

Code review nie da się zrobić bez code

1 odpowiedź

odpowiedź 27 sierpnia 2018 przez hun1er76 Stary wyjadacz (11,960 p.)
wybrane 28 sierpnia 2018 przez Elemental

Najlepsza

W CSS zwykle nie ma większego znaczenia, gdy używa się właściwości, które są powszechnie obsługiwane przez przeglądarki. Dodatkowo najlepiej używać rozwiązań, które są wygodne w implementacji.

1. Nie ma znaczenia, ale jeżeli nie będzie hamburgera to flex świetnie nadaje się do zmiany poziomej listy w pionową.

2. Jedno jest pewne, najlepiej ustawić wyświetlanie blokowe dla elementów a w nawigacji, aby możliwe było ich kliknięcie na całym rozmiarze elementu, a nie tylko zawartym tekście.

3. Najłatwiej paddingiem. Logo jest obrazkiem, więc line-height się nie nada.

4. Zależy, czy tytułem jest sam tekst, czy dodatkowo jakiś obrazek lub przycisk, czy tło jest jednolite czy jest np. sliderem. Margin-top nie bardzo.

5. Moim zdaniem padding, łatwiej jest nim manipulować przy responsywności.

6. Nie ma znaczenia. Znaczenie by było gdyby to był obrazek wektorowy, a byłoby pomiędzy czy użyć img, background-image a inline czy linkowanie jako symbol.