Kurs HTML odc. 4 Scrollup - przycisk bez grafiki

Question

Wykorzystałem informację zawarte w czwartym odcinku kursu html, do stworzenia przycisku odsyłającego do góry strony.

Z początku wydawało mi się, że coś źle wpisałem, tak więc skopiowałem wszystkie elementy zarówno html i css odnośnie tej funkcjonalności z plików źródłowych, lecz nadal przycisku nie było.

Po chwili jednak spostrzegłem najeżdżając w to miejsce kursorem, że zmienia on swój wygląd. Przycisk jest i działa, natomiast jest pozbawiony grafiki. Zamiana background: url("img/up.png"); na background-color: #ffffff lub inny powoduje prawidłowe wyświetlenie się przycisku. Oczywiście grafika znajduje się w odpowiednim miejscu, w formacie i zapisie rozszerzenia małymi literami.

Comments

Nie widzę nigdzie twojego pytania, o co pytasz?

---

Jest treść, ale wkleję raz jeszcze:

Wykorzystałem informację zawarte w czwartym odcinku kursu html, do stworzenia przycisku odsyłającego do góry strony.

Z początku wydawało mi się, że coś źle wpisałem, tak więc skopiowałem wszystkie elementy zarówno html i css odnośnie tej funkcjonalności z plików źródłowych, lecz nadal przycisku nie było.

Po chwili jednak spostrzegłem najeżdżając w to miejsce kursorem, że zmienia on swój wygląd. Przycisk jest i działa, natomiast jest pozbawiony grafiki. Zamiana background: url("img/up.png"); na background-color: #ffffff lub inny powoduje prawidłowe wyświetlenie się przycisku. Oczywiście grafika znajduje się w odpowiednim miejscu, w formacie i zapisie rozszerzenia małymi literami.

---

Najwidoczniej się nie znajduje skoro się nie wyświetla, ewentualnie masz namieszane w pliku css (np. brak średnika po któreś z instrukcji ---> ale to tylko wróżenie bez kodu).

Answer 1

Przekopiowałem ci kod CSS mojego buttona (www.dominator-motocykle-gorzow.pl) Może akurat coś wyłapiesz :)

.scrollup
{
    width: 64px;
    height: 64px;
    text-decoration: none;
    background: url("img/up.png") no-repeat 0px 0px;
    position: fixed;
    right: 50px;
    bottom: 50px;
    display: none;

Comments

Witam. A gdzie image we właściwości background ?

---

https://developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties

---

Background jest skróconą metodą określania właściwości odpowiedzialnych za tło elementu. Łączy pięć właściwości w jednej deklaracji. Jednakże jeżeli nie ustawisz jednej z właściwości przeglądarka użyje jej domyślnej wartości.

---

Ustawiłem "no-repeat 0px 0px;" jak możesz zauważyć na stronie, wszystko pięknie działa

Answer 2

Niestety nie udało mi się w żaden sposób wyświetlić grafiki na tym przycisku. Obszedłem to w taki sposób, że na kwadrat z kolorem tła, który od początku był widoczny nałożyłem znak z fontello i w ten sposób wszystko działa prawidłowo.

Przynajmniej nie mam zbędnej grafiki :D