Technical documentation paeg

HTML-CSS
1

hello , can someone help me , this is my project i cannot pass the 16 test, when the viewport gets smaller my navbar is not being seen , i want my navbar to be pushed to the down

2

So mainly, the test just says that it should be fixed on the left side of the screen so a simple reordering of divs/columns should do the trick.

1 Like
3

As said, you have the nav on the right side, it needs to be on the left side. You can just swap the source order (BS also has an Order utility class).

Do you want the nav fixed at the bottom on small screens? You can give the container a min-height and pin the navbar to the bottom.

@media only screen and (max-width: 768px) {
  .content,
  nav {
    flex: 0 0 100%;
    background-color: #bbcae8;
  }
  .row {
    flex-wrap: wrap-reverse;
    flex-direction: column-reverse;
  }

  #nav-div {
    min-height: 270px;
  }

  #navbar {
    bottom: 0;
    width: 100%;
    z-index: 10;
  }
}
1 Like