CSS CSS Layout Basics CSS Layout Project Column Layout with Media Queries

Rimvydas Šidlauskas
Rimvydas Šidlauskas
2,704 Points

Could someone help me, I can't get main-nav centered.

Hello.

I think I followed the instructions, but I did something wrong and I cant get main-nav part centered.

https://w.trhou.se/r874y7i47v (my bad, made it to Snapshot)

Thank you.

1 Answer

Steven Parker
Steven Parker
203,990 Points

The media queries float the nav to the right at screen sizes of 769 pixels or more.

The nav is centered on screens with widths smaller than that. That part seems to be working as designed, though you might want to eliminate the bullets:

.main-nav {
  list-style: none;
}
Rimvydas Šidlauskas
Rimvydas Šidlauskas
2,704 Points

Oh, I formulated my questiong in the wrong way, sorry for my english.

What I meant was how should I center main-nav in media query (min-769px), because it appears at the top. https://imgur.com/a/63eWc

Steven Parker
Steven Parker
203,990 Points

There's a few ways to handle this, one of them is with margins. Since the nav items also seemed a bit crammed together, I added this to the 769 pixel media query:

  .main-nav a {
    margin: 17px 8px;
  }
Rimvydas Šidlauskas
Rimvydas Šidlauskas
2,704 Points

I tried to figure it out for so long. Thank you.