Witajcie. Chciałem poszerzyć jedną z prowadzonych przeze mnie stron internetowych jednocześnie uzyskując przestrzeń na dwie informacje w divach obok siebie. Udało już mi się dojść do tego jak zmusić divy do ustawiania się obok siebie, ale od dwóch godzin walczę z wolną przestrzenią, która powstaje mi po każdej trzeciej informacji z rzędu (tak jak na załączonym obrazku). Mój kod poniżej - treść to element w ramach którego pojawiają się informacje, info to div z informacjami. Będę wdzięczny za pomoc.
To nie to. Teraz zauważyłem że jak w info zmienię float: left na right to ładnie układają się elementy po lewej stronie a po prawej mam dziury
Doszedłem gdzie tkwi problem, jednak nadal nie potrafię go rozwiązać. Winny jest float - trzeci obiekt nie może być oblany z lewej strony bo z definicji oblewany jest tylko z prawej, dlatego kolejny element tworzy dziurę bo może pojawić się dopiero pod tym trzecim. Pytanie jest następujące - co zrobić, aby div był oblewany z obu stron, albo żeby to jakoś inaczej sensownie ułożyć, niekoniecznie floatem.
Ode mnie dodatkowe rozwiązanie w samym CSS, ale nie do końca idealne https://jsfiddle.net/30petst9/. jak można zobaczyć w niektórych przypadkach, zależnie od tego jak się ułożą kontenery względem siebie może dojść do lekkiego rozjechania się.
EDIT:
Oczywiście można to podzielić po stronie serwera na dwa kontenery (lewy i prawy) i co drugiego wrzucać do prawego kontenera tak jak zaproponował to @Apostol1, ale rozwiązanie takie obciąży z kolei dodatkowo serwer oraz chyba wpłynie negatywnie na SEO (trzeba skonsultować ze specjalistą).
Generalnie ja bym chyba wolał wyświetlać jednakowej wysokości wiadomości z odnośnikiem do pełnej treści ponieważ lepiej wpłynie to na SEO oraz sprawi iż użytkownicy zaczną częściej odwiedzać podstrony serwisu.
Teraz moja subiektywna opinia, nie lubię wyświetlania dłuższych treści które trzeba czytać w dwóch lub więcej kolumnach, tym bardziej jeśli treści mają różną wysokość. Jest to niewygodne dla czytelnika, strona internetowa to nie gazeta by układ wielokolumnowy sprawdzał się do prezentowania dłuższych treści.
@Apostol1 dla mnie nie ma różnicy czy robię duży serwis albo aplikację czy małą stronę firmową typu wizytówka, wszystko ma być zrobione najlepiej jak umiem. Zarówno jakość kodu ma być najlepsza jaką jestem w stanie na dzień dzisiejszy zapewnić jak i projekt całej witryny. Nie należy nigdy ignorować user experience bo nie jeden raz jakiś projekt zyskiwał na popularności tylko dlatego że był dobrze zaprojektowany w przeciwieństwie do konkurencji i użytkownicy wygodnie mogli używać aplikacji.
UI i UX jest tak samo ważne jak dobry i zoptymalizowany kod, możesz mieć najpiękniejszy kod, mieć najlepsze funkcje, ale jak zawalisz UI i UX nie będziesz miał użytkowników/klientów.
Nie koniecznie, można poprawiać systematycznie małymi kroczkami. Czasami faktycznie taniej/szybciej/lepiej zrobić coś od nowa, ale nie zawsze ma to sens.
Edit:
Poza tym ciężko coś powiedzieć na podstawie jednego screena.
