I don't know how to fix this (Technical Documentation Page)

Describe your issue in detail here.
I checked the html and I think it’s fine, since I started the css I found a problem that I can’t solve, trying to replicate the challenge, the on the left overlaps and there is a scroll on the y-axis.

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/100.0.4896.127 Safari/537.36

Challenge: Build a Technical Documentation Page

Link to the challenge:

The horizontal scrollbar is there because one of your images is too large (https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/HTML_basics/grumpy-cat-attribute-small.png), this one specifically. You can fix that by decreasing its size like this,

img {
  width: 50%;

You could also set a max width, or change the percentage, that’s just what I used.
Although you might want to give it a class though so that you can just change the size of that specific image.

For the scrollbar in the nav, you could modify its look like this,

nav ::-webkit-scrollbar {
  /* Styles */

I am unsure the exact outcome you’d prefer, but you could change its size, position, and even hide it, although hiding it does look nicer, it might be confusing to users so I would not recommend it.

As an alternative, you could also try something like this:

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.