Dołącz do zespołu ekspertów! Backend lub Frontend Developer?

Sprawdź najnowsze oferty pracy naszego partnera - 8lines.io!

Ikony aktywności działów - Font Awesome

Założony przez  Cezary Stasiak.

Chciałbym, aby ikonki Font Awesome pokazywały aktywność działu. Szukałem różnych poradników, ale te, które znalazłembyły tylko do różnych ikon dla określonego działu.
Jest lepiej choć nie jest to po środku, mam dodane text-align: center
Usuń całkiem position: relative; i poczytaj o tym. To że to napisałem nie znaczy, że masz to wklejać do swojego kodu.
Poza tym usuń jeszcze left: -5px i top: 0. Czemu? Patrz wyżej.

Tak w skrócie:
Domyślnie relatywny jest obszar widoczny przez ciebie po załadowaniu strony, może ich być więcej w kodzie.

--div.container
  --div.content
    --section
      --article

Jeśli do section dasz position absolute, a do container position relative, to section będzie położony względem div o klasie container

Ciężko mi to wytłumaczyć, w google jest o tym pełno informacji.
http://www.w3schools.com/css/css_positioning.asp
Kodowanie, edycja i tworzenie styli, for, stron, poszczególnych elementów - polecane szczególnie dla osób, które nie potrafią sobie poradzić z problemami.
Usunąłem position: relative; oraz top: 0;. Dzięki za informację. Jednak potrzebuję jeszcze pomocy. Otóż widać tylko kłódkę przy dziale. Oznacza dobrze, że dział jest zablokowany, jednak nie wiem czemu, np. nie ma żadnej ikony przy dziale, który nie zawiera nowych postów. Muszę coś ustawić z background-position?
Eh. za jaką ikonkę odpowiada .forum_offlock? Tak za zamknięte działy. Dodałeś klasy dla nowych postów i ich braku?
Wszystkie klasy są
.forum_status {
height: 50px;
width: 50px;
font-size: 30px;
text-align: center;
font-family: FontAwesome;
}

.forum_status i {
display: inline-block;
line-height: 50px;
}

.forum_on:before {
color: #0094d1;
      font-family: FontAwesome;
text-align: center;
}

.forum_off, .forum_offlock, .forum_offlink {
  font-family: FontAwesome;
text-align: center;
color: #333;
}

.forum_off i {
opacity: .4;
}

.forum_off:before {
content: "\f023";
  font-family: FontAwesome;
text-align: center;
}

.forum_offlock:before {
content: "\f023";
  font-family: FontAwesome;
text-align: center;
}

.forum_offlink:before {
content: "\f0c1";
font-family: FontAwesome;
text-align: center;
}
Żeby :before ci działało musisz dodać jeszcze content z kodem ikonki. W .forum_on:before tego nie dodałeś.
Kodowanie, edycja i tworzenie styli, for, stron, poszczególnych elementów - polecane szczególnie dla osób, które nie potrafią sobie poradzić z problemami.
Ok, problem z klasami rozwiązany, teraz jak zmienić ikony dla poszczególnego stanu działu?
Zmień kod, dawałem już link wcześniej:
http://fontawesome.io/cheatsheet/

Musisz je dodawać w takiej postacji jakiej tutaj są zapisane:
http://astronautweb.co/snippet/font-awesome/ (tutaj nie masz wszystkich)
Kodowanie, edycja i tworzenie styli, for, stron, poszczególnych elementów - polecane szczególnie dla osób, które nie potrafią sobie poradzić z problemami.



Użytkownicy przeglądający ten wątek:

1 gości