Zamiana flaticon na img (Bootstrap)

Question

Hej.

Nie siedzę za bardzo w Bootsrapie, zrobiłem stronę (www.gajaiprzyjaciele.pl), na podstawie gotowej skórki.

Teraz poproszono mnie, abym w miejsce flaticon wrzucił logo firmy, no i nie mogę ogarnąć ;)

Chodzi o ikonę "łapki" po lewej stronie głównego menu, w jej miejscu ma się znaleźć logo.

Oryginalny kod:

div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-main-collapse">
    <i class="fa fa-bars"></i>
</button>
<!-- Logo -->
<div class="page-scroll">
    <a class="navbar-brand" href="#page-top">
        <!--Font Icon logo and text -->
        <span class="flaticon-animals-allowed"></span>GAJA I PRZYJACIELE
    </a>
</div>
</div>

Z góry dziękuję za pomoc:)

Answer 1

Wytnij tą część:

<span class="flaticon-animals-allowed"></span>GAJA I PRZYJACIELE

I wklej logo przy pomocy znacznika img, jak pozostałe zdjęcia. Prawdopodobnie przyda się również klasa "img-responsive" Chyba, że masz logo w formacie svg, to wtedy możesz wkleić kod bezpośrednio w to miejsce bez img. 

Comments

Próbowałem tak:

<div class="page-scroll">
    <a class="navbar-brand" href="#page-top">
        <!--Font Icon logo and text -->
        <img src="img/logo.jpg" class="img-fluid" alt="Responsive image">GAJA I PRZYJACIELE
    </a>
</div>

Logo, co prawda się pojawia, ale jest strasznie wielkie, strona traci responsywność.

---

Z tego co widzę, to strona jest postawiona na bootstrapie 3, a nie 4, więc klasa "img-fluid" nie zadziała (jest z czwóreczki). Dodaj tak jak prosiłem "img-responsive". Jeśli logo jest faktycznie ogromne, to je zmniejsz w jakimś programie graficznym, nie ma potrzeby ładować dużej grafiki, jeśli na stronie nigdy nie występuje w dużym rozmiarze. 

I strona ładuje się w nieskończoność, zadbaj o zmniejszenie rozmiaru zdjęć (https://tinyjpg.com/)

---

Dziękuję. Pomogło, faktycznie problem był w wersji Bootstrapa.