Bootstrap - navbar-toggler-icon nie pokazuje się

pytanie zadane 26 marca 2019 w HTML i CSS przez kingkushlee Gaduła (3,960 p.)
zamknięte 26 marca 2019 przez kingkushlee

Witam, mam takie kody:

index.html:

<!DOCTYPE html>
<html lang="en">
<head>

	<meta charset="UTF-8">

	<meta name="description" content="KHROGNAR official site">
	<meta name="keywords" content="metal, zespol, khrognar, vinyl, rzeszow, blackened, death, koncerty, koncert, klub">
	<meta name="X-UA-Compatibile" content="IE=edge,chrome=1">
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
	<link rel="stylesheet" href="css/main.css">

	<title>KHROGNAR</title>

</head>
<body>

	<header class="logo d-md-block mx-auto">
		<img src="../khrognar/img/logo.png" alt="">
	</header>

	<nav class="navbar navigation">
		<a class="link" href="#">Strona główna</a>

		<button class="navbar-toggler" type="button">
        	<span class="navbar-toggler-icon"></span>
    	</button>
	</nav>

	<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>

main.css:

@font-face {
  font-family: 'Burzum';
  src: URL('GregorianFLF.ttf') format('truetype');
}

::selection {
	background-color: #eaf9f8;
	opacity: .8;
}

body {
	margin: 0!important;
	background-color: #000;
	color: #FFF;
	font-family: 'Burzum';
	font-size: 20px;
}

img {
	width: 100%;
}

.logo {
	text-align: center;
	display: none;
}

.logo img {
	width: 720px;
	height: 300px;
}

nav.navigation {
	background-color: #303030;
	font-size: 32px;
}

a.link {
	text-decoration: none;
	color: #FFF;
}

Mimo to .navbar-toggler-icon nie pokazuje się. Nawet po zmianie koloru na biały nie chce się pokazać. Proszę o pomoc

komentarz zamknięcia: DONE

komentarz 26 marca 2019 przez kingkushlee Gaduła (3,960 p.)

Dodam, że w konsoli nie pokazuje żadnych błędów

1 odpowiedź

odpowiedź 26 marca 2019 przez Arkadiusz Fajdek Dyskutant (9,450 p.)
wybrane 26 marca 2019 przez kingkushlee

Najlepsza

1) Wiesz że ten toggle pokazuje sie na małym ekranie tylko?
2) Na ciemnym nic nie widziałem
3) Dodałem coś do menu żeby mogło się wyświetlić

<!DOCTYPE html>
<html lang="en">
<head>
 
    <meta charset="UTF-8">
 
    <meta name="description" content="KHROGNAR official site">
    <meta name="keywords" content="metal, zespol, khrognar, vinyl, rzeszow, blackened, death, koncerty, koncert, klub">
    <meta name="X-UA-Compatibile" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <link rel="stylesheet" href="css/main.css">
 
    <title>KHROGNAR</title>
 
</head>
<body>
 
    <header class="logo d-md-block mx-auto">
        <img src="../khrognar/img/logo.png" alt="">
    </header>
 
    <nav class="navbar navigation navbar-expand-lg navbar-light bg-light">
        <a class="link" href="#">Strona glowna</a>

		<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
			<span class="navbar-toggler-icon"></span>
		</button>
		
		  <div class="collapse navbar-collapse" id="navbarSupportedContent">
			<ul class="navbar-nav mr-auto">
			  <li class="nav-item active">
				<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
			  </li>
			  <li class="nav-item">
				<a class="nav-link" href="#">Link</a>
			  </li>
			  <li class="nav-item">
				<a class="nav-link disabled" href="#">Disabled</a>
			  </li>
			</ul>
		</div>	
    </nav>
	

 
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>