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

Bootstrap / nie widać pasków w navbar-toggler oraz menu po lewej stronie

VPS Starter Arubacloud
0 głosów
349 wizyt
pytanie zadane 20 sierpnia 2018 w HTML i CSS przez NataliaWasko Nowicjusz (220 p.)
zmienione kategorie 20 sierpnia 2018 przez NataliaWasko

Hej,

Mam dwa problemy.

1. Nie widać zawartości navbar-toggler-icon. (zdjęcie)

Nie ma tych paseczków, próbowałam już wielu konfiguracji i nadal nie wiem jak to "odzyskać".

Kod:

.navbar-dark-custom {
	background-color: $color-primary-dark;
	color: $white;
	
	a {
		color: darken($white,10%);
		font-weight: 600;
		text-transform: uppercase;
		&:hover {
			color: $color-secondary-light;
		}
    	
    	&:active {
    		color: $color-secondary-dark;
    	}
	}

	.navbar-brand {
		color: $white;
		text-transform: none;
		font-weight: 300;
	}

	.navbar-nav {
		padding-left: 50%;
		// float: right;
		// padding-right: 0;
	}

	.navbar-toggler { 
		background-color: darken($color-primary-dark, 5%);
		border-color: $color-primary;

	.navbar-toggler-icon {
    	border-color: $white;
  		}

	}

}
<!-- Menu navbar -->

	<nav class="navbar navbar-expand-lg sticky-top navbar-dark-custom">
		<div class="container">
			<a class="navbar-brand" href="#">Natalia Waśko</a>

				<!-- fragment odpowiedzialny za menu rozwijane na komórkach -->
				<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navContent" aria-label="Toggle navigation">
				    <span class="navbar-toggler-icon"></span>
				</button>
			
			<div class="collapse navbar-collapse" id="navContent">
				<ul class="navbar-nav">
					<li class="nav-item active"><a href="#" class="nav-link">Główna</a></li>
					<li class="nav-item"><a href="#" class="nav-link">Aktualności</a></li>
					<li class="nav-item"><a href="#" class="nav-link">Oferta</a></li>
					<li class="nav-item"><a href="#" class="nav-link">Portfolio</a></li>
					<li class="nav-item"><a href="#" class="nav-link">Kontakt</a></li>
				</ul>
		</div>		
	</nav>

2. Wiem, że to pewnie jest proste, ale nie wiem jak linki w menu ustawić po prawej stronie. Działa tylko:

	.navbar-nav {
		padding-left: 50%;
	}

ale to jest tak na oko.

Próbowałam navbar-right, float: right i jeszcze kilku innych rozwiązań z internetu - nic nie zadziałało.

Przepraszam jeśli taki temat już był, ale obijam się o ten temat już parę godzin.

komentarz 20 sierpnia 2018 przez niezalogowany
Zła kategoria -> Html/Css
komentarz 20 sierpnia 2018 przez NataliaWasko Nowicjusz (220 p.)
Fakt, już poprawiłam :)
komentarz 20 sierpnia 2018 przez StOcK Mądrala (6,100 p.)

@NataliaWasko, wrzuć gdzieś na jsfiddle, z potrzebnymi bibliotekami

1 odpowiedź

0 głosów
odpowiedź 20 sierpnia 2018 przez StOcK Mądrala (6,100 p.)
wybrane 21 sierpnia 2018 przez NataliaWasko
 
Najlepsza

Spróbuj dodać klasę navbar-light do nav

Podobne pytania

0 głosów
1 odpowiedź 418 wizyt
0 głosów
1 odpowiedź 157 wizyt
pytanie zadane 20 października 2019 w Rozwój zawodowy, nauka, praca przez rice Początkujący (440 p.)
0 głosów
1 odpowiedź 322 wizyt
pytanie zadane 15 sierpnia 2019 w Nasze projekty przez suciorek Nowicjusz (120 p.)

92,455 zapytań

141,263 odpowiedzi

319,100 komentarzy

61,854 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

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

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!

...