Technical Documentation Page review and help

Hi, just finished my Technical documentation page. here it is: https://codepen.io/Ast2435/full/YzKQBXw

I think it’s my best one yet because it doesn’t have any colors and i suck with colors, also, it doesn’t need much CSS. If anything, i would like help with media queries, i wanted to make the text re-arrange itself if the viewport was too small, but i forgot how to do that, i tried targetting the section class in the media query, but i couldn’t get it to work, and i didn’t want to put every paragraph, title, img, and code inside divs, since they are inside a section already i thought it was enough. Basically, i want to eliminate the X-axis scroller.

edit: fixed the issue with this code:


#main-doc pre{
overflow-x: auto;
  white-space:pre-wrap;
  word-wrap: break-word;
   }

It had to do with the <pre> tags i used to format the code, it was messing with the responsive design.
Now it’s really finished unless someone points out something wrong.

1 Like

Try adding this to your css and see if you like it that way :slight_smile:

html {
  scroll-behavior: smooth;
}
1 Like

@michel-z Wow, much better, great improvement with just a line of code, thanks for the tip!

1 Like

firstly, looks quality on desktop, and secondly its a very apt topic it being on flex box.

there will probably be someone out there who knows far more than me, who will scrutinize it to its death, but for my 2 pence, its good stuff!

1 Like

Hey, that’s great feedback, thanks man!