Pozycjonowanie divów względem siebie

pytanie zadane 2 sierpnia 2015 w HTML i CSS przez Patrycjerz Mędrzec (192,320 p.)
zamknięte 3 sierpnia 2015 przez Patrycjerz

Witam,

oglądając jeden z kursów HTML Pana Zelenta: https://www.youtube.com/watch?v=5y3Qc9Qs6TY można zobaczyć, że Pan Mirek oddziela pary przylegających ze sobą divów (chodzi o linki) pustym divem ze stylem clear: both.

Tutaj moje pytanie. Czy tworzenie takich pustych divów jest stylistycznie i standardowo dobrym posunięciem? Przecież można np. te pary divów (linków) opakować w dwa divy i te zewnętrzne ładnie by się układały w kolumnę. Wtedy nie musielibyśmy tworzyć pustego diva.

Za odpowiedzi będę wdzięczny.

komentarz zamknięcia: Problem rozwiązany

2 odpowiedzi

odpowiedź 3 sierpnia 2015 przez Comandeer Guru (600,810 p.)
wybrane 3 sierpnia 2015 przez Patrycjerz

Najlepsza

Nie. Tego typu działania nie mają żadnego uzasadnienia, zwłaszcza gdy wie się, że w CSS istnieją pseudoelementy ::before, ::after mogące pełnić takie funkcje

Przegląd lepszych technik można znaleźć tutaj: http://www.forumweb.pl/porady-i-tutoriale-www/css-clearowanie-czyli-problemy-z-float,47914 i http://nicolasgallagher.com/micro-clearfix-hack/

komentarz 3 sierpnia 2015 przez Patrycjerz Mędrzec (192,320 p.)

Hehe, moja intuicja mnie nie zawiodła Dzięki!

komentarz 3 sierpnia 2015 przez Wiciorny Ekspert (269,710 p.)

zawsze wiadomo w pliku css- mozna zalaczyc clear: both;

komentarz 3 sierpnia 2015 przez Patrycjerz Mędrzec (192,320 p.)

Przepraszam, że zawracam głowę, ale to before i after tworzą domyślnie pusty element inline, więc jeśli nadamy mu wartośc clear: both, to i tak chyba łamiemy konwencję, bo czy to pusty div, czy inline, to jeden pies. Więc czy to jest w pełni poprawne podejście?

komentarz 3 sierpnia 2015 przez Comandeer Guru (600,810 p.)

Różnica jest bardzo duża. Div to element HTML, więc znajduje się w warstwie treści strony internetowej. Stąd można powiedzieć, że pusty element jest niesemantyczny, gdyż nic nie wnosi do struktury treści. Natomiast pseudoelementy należą do warstwy prezentacji. Jak sama nazwa wskazuje - to pseudoelementy, a więc jedynie atrapy doczepiane do prawdziwych elementów. Ich zadaniem jest umożliwienie wykonania bardziej skomplikowanych wizualnych rzeczy na stronie. Ich zadanie jest w pełni prezenentacyjne, stąd nie można tu wgl mówić o semantyce. Pseudoelementy są częścią CSSa i jako takie należy je rozpatrywać. Co więcej: umieszczanie w nich treści jest wskazane tylko wówczas, gdy jest ona jedynie dodatkowym wizualnym wskaźnikiem dla treści w tagach HTML (np dodanie słowa "wymagane" po input[required]).

odpowiedź 3 sierpnia 2015 przez PreZmyK Pasjonat (21,470 p.)

W małych projektach taki pusty div nie będzie przeszkadzał. Nawet sam Chris Coyier ich używał ;P

komentarz 3 sierpnia 2015 przez Comandeer Guru (600,810 p.)

Natomiast Harry Roberts nie.

W 98% przypadków tego typu element jest całkowicie zbędny i nie ma sensu go używać, skoro ::before czy ::after spełniają swoje zadanie w tym względzie.