Uciekające menu

Question

Witam

Mam problem z paskiem menu. Przy oddalaniu witryny zawartość main-nav ucieka do lewej strony. Chciałbym żeby pozycja divów w main-nav nie ulegała zmianie. Przy ustawieniu width container w pikselach wszystko jest dla mnie zrozumiałe ale po przeskoczeniu na width:100%; w container, nie wiem jak nad tym zapanować.

https://ibb.co/mHWTLH

<div class="container">
		
		<div class="main-nav">
			<div class="nav"><a href="#">STRONA GŁÓWNA</a></div>
			<div class="nav"><a href="#">O FIRMIE</a></div>
			<div class="nav"><a href="#">ASORTYMENT</a></div>
			<div class="nav"><a href="#">USŁUGI</a></div> 
			<div class="nav"><a href="#">KONTAKT</a></div> 
			<div style="clear:both;">
		</div>
		
	</div>

.main-nav
{
	background-color: black;
	opacity: 0.5;
	width: 100%;
	font-size: 20px;
	font-weight: 400;
	padding-left: 100px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-top: 10px;
	margin: auto;
}
	
.nav
{
	float:left;
	min-width: 50px;
	height: 25px;
	font-size: 18px;
	padding-left: 20px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-top: 10px;
	border-right: 1px solid #333333;
}

Dziękuję za pomoc.

Comments

Menu powinno być oparte na liście ul

Answer 1

dodaj do nav-main text-align: center;