• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Logo w navbar-header

Object Storage Arubacloud
0 głosów
672 wizyt
pytanie zadane 18 stycznia 2018 w HTML i CSS przez Kacper Mieliński Użytkownik (600 p.)

Witam mam taki problem ponieważ nie umiem wyskalować loga żeby było dobrze widoczne w navie.

Wymiary obrazu 1890x1417

Html

    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <a class="navbar-brand" href="#"><img src="/img/logo.png"/></a>
            </div>
            <ul class="nav navbar-nav">
                <li><a href="#">Home</a></li>
                <li class="active"><a href="#">About</a></li>
            </ul>
        </div>
    </nav>

CSS:

.navbar{
    font-size: 3rem;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid pink;
}

 

3 odpowiedzi

–1 głos
odpowiedź 19 stycznia 2018 przez Jakub Radziejewski Obywatel (1,090 p.)
wybrane 19 stycznia 2018 przez Kacper Mieliński
 
Najlepsza

Cześć :)

Jeżeli chcesz wyskalować 'logo' by zachowywało się podobnie jak to z YouTube, to ustaw wymiary na sztywno. Tu polecam na około 100px, dokładniej

    img{
      width:  100px;
      position: fixed;
      top: -15px;
     }

Natomiast jeżeli to logo to powinno mieć wymiary dostosowane pod kod, a nie kod dostosowany pod logo.

0 głosów
odpowiedź 18 stycznia 2018 przez thryndl Nałogowiec (30,470 p.)

Nadaj obrazkowi klasę 

img-fluid

dokumentacja: https://getbootstrap.com/docs/4.0/content/images/#responsive-images

komentarz 18 stycznia 2018 przez Kacper Mieliński Użytkownik (600 p.)
Obrazek nadal taki sam wychodzi po za divy i poza stronę
komentarz 18 stycznia 2018 przez thryndl Nałogowiec (30,470 p.)

A przy klasie: img-responsive zamiast img-fluid?

komentarz 18 stycznia 2018 przez Kacper Mieliński Użytkownik (600 p.)
Niestety także nie działa.
komentarz 18 stycznia 2018 przez thryndl Nałogowiec (30,470 p.)
Wklej gdzieś na bina cały kod html i css
komentarz 18 stycznia 2018 przez Kacper Mieliński Użytkownik (600 p.)
edycja 18 stycznia 2018 przez Kacper Mieliński
0 głosów
odpowiedź 18 stycznia 2018 przez Rahim Początkujący (360 p.)
A jak te logo chcesz żeby wyglądało?
komentarz 18 stycznia 2018 przez Kacper Mieliński Użytkownik (600 p.)
Mniej więcej coś takiego jak logo youtuba.
komentarz 18 stycznia 2018 przez Rahim Początkujący (360 p.)
na .container-fluid daj display:flex;

ustaw tez szerokosc loga

Podobne pytania

0 głosów
2 odpowiedzi 489 wizyt
pytanie zadane 21 września 2017 w HTML i CSS przez Apper97 Obywatel (1,380 p.)
0 głosów
1 odpowiedź 132 wizyt
pytanie zadane 10 lutego 2016 w PHP przez fusemul Użytkownik (710 p.)
0 głosów
1 odpowiedź 531 wizyt

92,761 zapytań

141,685 odpowiedzi

320,485 komentarzy

62,105 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...