Dzień dobry!
Dziś porcja kolejnych problemów z którymi nie mogę sobie poradzić:
Chcę aby content w navbarze znajdował się na środku, a nie tak jak domyślnie po lewej. Próbowałem dodawać już justify-align-center, mx-auto ale w sumie to nic nie dawało:
Z góry dziękuję za odpowiedź!
Poniżej screen i kod:
<!DOCTYPE HTML>
<html lang="pl">
<html>
<head>
<meta charset="utf-8"/>
<title>Random Projects</title>
<meta name="description" content="Strona projektu na konkurs CanSat 2019 poland" />
<meta name="keywords" content="CanSat, kopernik, 2019, team, esero, technikum"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link rel="stylesheet" href="style.css"/>
<link href="https://fonts.googleapis.com/css?family=Comfortaa:400,700&subset=latin-ext" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Quicksand:300,500&subset=latin-ext" rel="stylesheet">
</head>
<body>
<header>
<nav class="navbar navbar-dark bg-primary navbar-expand-lg">
<a class="navbar-brand align-bottom" href="index.html">
<img class="mr-2" src="logo1.png" width="30" height="auto" alt=""/>
Logo</a>
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#mainmenu">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="mainmenu">
<ul class="navbar-nav mb-1">
<li class="nav-item active">
<a class="nav-link" href="Start.html"> Start </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"> Projekt </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"> Ekipa </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"> Kontakt </a>
</li>
</ul>
</div>
</nav>
</header>
<main>
<div class="row p-2">
<div class="col-0 col-sm-1 col-md-2 col-lg-3"> </div>
<div class="col-12 col-sm-10 col-md-8 col-lg-6 p-3 mb-5">
<h1>Test</h1>
<p>
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
</div>
<div class="col-0 col-sm-1 col-md-2 col-lg-3"> </div>
<div class="col-0 col-sm-1 col-md-2 col-lg-3"> </div>
<div class="col-12 col-sm-10 col-md-8 col-lg-6 p-md-3">
<h1>Test</h1>
<p>
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
</div>
</main>
<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.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>
body {
/*font-family: 'Comfortaa';*/
font-family: 'Quicksand', sans-serif;
}
.row {
margin-left: 0px;
margin-right: 0px;
}
.navbar-brand {float:none;}
nav {
font-size: 19px;
font-weight: 300;
}
.welcome
{
min-height: 75vh;
background-color: #DDDDDD;
}
body::-webkit-scrollbar {
width:4px;
height: 5px;
}
body::-webkit-scrollbar-thumb {
background-color: #afafaf;
border-radius: 2px;
height: 5px;
}
body::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(224, 224, 224, 1);
}
h1 {
font-weight: 300;
}
h5 {
font-weight: 300;
}
