Problem z dodaniem różnych ikonek

Wersja skryptu: 1.8.7
Adres forum:  http://premier-manager.xaa.pl
Opis problemu: https://webboard.pl/thread-58224.html?pi...#pid289773

Pogubilem sie. Doszlem do:

"Dalej w tym samym pliku dodajemy

.forum_on_1, .forum_off_1 {
   background-position: 0 0;
}

.forum_on_2, .forum_off_2 {
   background-position: -30px 0;
}
/* i tak dalej */"

Utworzyłem  w D:/Moj komputer/Program Files/Ikonki i w tym folderze dałem ikonki np: Everton.png. dobrze zrobiłem? I właśnie zrobiłem plik ikonki.css w ACP i mam tak:

.forum_status {
    height: 30 px; /*48 */
    width: 30px; /*48 */
    background: url(images/forum_icon_sprite.png) no-repeat 0 0; /*D:/Mój komputer/Program Files/Ikonki */
display: inline-block;
}

.forum_on_1, .forum_off_2 {
    background-position: 0 0; 
}

.forum_on_2, .forum_off_2 {
    background-position: -30px 0;
}

Dobrze zrobiłem? Jak i gdzie dodać te obrazki z folderu Ikonki? Na total commanderze? Sorki ale jestem w tym kompletnie zielony.

Ikony powinny być umieszczone w tym samym pliku i być tych samych wymiarów.
Plik ten wrzucasz na serwer poprzez użycie klienta FTP (np. Total Commander, FileZilla) do katalogu images.
Zapis, kórego używasz jest nieprawidłowy, w poradniku masz napisane:

.forum_status {
height: 30px; /*wysokość Twoich ikonek */
width: 30px; /*szerokość Twoich ikonek */
background: url(images/forum_icon_sprite.png) no-repeat 0 0; /*ścieżka do pliku z ikonkami */
display: inline-block;
}

to co jest w /* ... */ informuje do czego służy dana linia. Swoje wartości wstawiasz zamiast odpowiednich znaków, np:

.forum_status {
height: 48px; /*wysokość Twoich ikonek */
width: 48px; /*szerokość Twoich ikonek */
background: url(images/twoj_plik_z_ikonami.png) no-repeat 0 0; /*ścieżka do pliku z ikonkami */
display: inline-block;
}

Porównaj, zobacz jaka jest różnica.

background: url(images/twoj_plik_z_ikonami.png) no-repeat 0 0; /*ścieżka do pliku z ikonkami */

To jaki plik mam podać? Images/<-- i tu folder z ikonami? I ta ścieżka to tak?

"*D:/Mój komputer/Program Files/Ikonki *

"*D:/Mój komputer/Program Files/Ikonki *

Rozumiem, że forum trzymasz na hostingu. Jeżeli podasz ścieżkę do ikonek bezpośrednio ze swojego komputera, to co się stanie jak go wyłączysz?

Ikonki musisz wysłać na serwer za pomocą FTP do folderu images. Możesz użyć totalcommandera albo filezilla do tego.

http://premier-manager.xaa.pl

Teraz mam jedną ikonkę we wszystkich działach, jeszcze połowę ucięło.

Nie czytasz tego, co do Ciebie piszemy.

Teraz mam jedną ikonkę we wszystkich działach

Ponieważ w pliku: http://premier-manager.xaa.pl/images/fa.png jest tylko jedna ikona. Musisz dać kilka ikon do jednego pliku, ikony powinny być tej samej wielkości i się stykać, przykład:
https://webboard.pl/attachment.php?aid=8775

jeszcze połowę ucięło.

Ucieło, bo podałeś za marą szerokość i wysokość w tym miejscu

.forum_status {
height: 48px; /*wysokość Twoich ikonek */
width: 48px; /*szerokość Twoich ikonek */
background: url(images/twoj_plik_z_ikonami.png) no-repeat 0 0; /*ścieżka do pliku z ikonkami */
display: inline-block;
}

Wysokość twojej ikony to 96px, a szerokość to 68px, a narzuciłeś mniejsze rozmiary, więc kawałek ucina.

http://i.imgur.com/wRAScLm.png

to ma tak wygladac ten plik z ikonami?

Tak, tylko zrób tak, żeby się stykały. Tak jak w przykładzie kółek, który podałem wyżej

http://i.imgur.com/6u1hlav.png

o to chodzi>?

Dobra, pomyłka. Ikony nadal masz w trzech plikach, a masz mieć w jednym. Pobierz GIMP'a i przenieś te obrazki do jednego pliku.

Kurr ale mi net odwala. Akurat teraz.. 25 mb/s. Nie moglbys ty tego jakos zrobic bo mnie zaraz tutaj szlag trafi. Od 7 siedze przy tym i jeszcze gimpa pobiera 2 godziny....

Zrób to online.
http://spritegen.website-performance.org/

Zapoznaj sie tez z css sprites np tutaj
http://blog.eduweb.pl/przyspiesz-swoja-s...s-sprites/

Divir, tam wyskakuja mi obok ikonek loga twittera itp...
Juz wiem o co chodzi. Ale potem jak dodam wszystkie ikonki do np. "ikonki.png" i wrzuce w images to jak ma wygladac zapis w .css? I gdzie te nazwy ikonek wpisac zeby byly w kazdym dziale?

Napisz w cssy w pliku global.css
I zapoznaj sie z tym co ci podeslalem.
To dziala jak zoom na fragmecie obrazka, zoom na dana ikonke.