Pozycje w CSS.

Question

Mam pytanko dotyczące pozycji w CSS. Mianowicie robię kod html i css posta. Spotkałem się jednak z problemem:

Zrobiłem trzy divy - jeden ma być po lewej stronie z krótkimi informacjami profilowymi, drugi z zawartością posta, a trzeci ze stopką posta. Niestety stopka ucieka na górę i się ukrywa, informacje profilowe zostają na miejscu, lecz tekst z posta idzie na dół :/ Strona znajduje się pod linkiem (tu). HTML można podejrzeć łatwo w przeglądarce. CSS dl pewności wolałem umieścić dodatkowo (tu). 

Answer 1

Znacznik center jest zdeprecjonowany, niepoprawne użycie tabeli(tutaj może dałbym listę definicji).

Ustaw box-sizing: border-box(jak nie wiesz jak działa ta właściwość to poczytaj https://css-tricks.com/almanac/properties/b/box-sizing/) dla wszystkich znaczników. Dla #trp-content width: 80% + trochę paddingu. Z tej 'stopki' usuń pozycje absolutną i ustaw szerokość na 100% - nie wiem czy o taki efekt chodziło.

EDIT:

https://css-tricks.com/snippets/css/clear-fix/ zastosuj dla elementu #topic_reply_post

Comments

Dzięki :) Przydało się :D

Answer 2

Opisz to dokładniej, bo nie wiem jak Ci pomóc - bardzo to ogólnikowe.

Tak czy inaczej, pierwszym krokiem który zauważyłem, to divy na floacie w pojemniku, to zawsze się krzaczy, więc albo nadrzędnemu nadajesz również float: left, lub overflow: hidden;

#topic_reply_post {

overflow: hidden;

}

Comments

tak to ma mniej-więcej wyglądać. (przeróbka w paincie) :D

---

No to źle to zakodowałeś, bo będzie Ci się rozpieprzać. Kodu za Ciebie nie napiszę, ale dam Ci wskazówkę na przyszłość, mianowicie:

Avatar z informacjami jako <div style="float: left; width: 20%">

Drugi div, również na floacie 80%, a w nim tekst <p></p> oraz stopka z łapkami, jeśli używasz spanów - to pamiętaj o display: block;

Wtedy będzie okej i pamiętaj, jak masz w jakimś divie pojemniku elementy posiadające float: left, nadaj mu również float: left, bądź overflow: hidden

Answer 3

Ok. Udało się  Dzięki za Waszą pomoc ;)