Technical Doc.Page - Content doesn't properly resize

Hello guys,

This might be a dumb question, but I’ll take the risk :smile: … I am very very new to this after all.

Something prevents the main-doc content from properly resizing
with screensize. In full screen it looks as it should, but when I resize the preview - not so much.

So, I want the main-doc to resize with screensize so that the whole text from left to right is visible at all times. How do I solve this??

Here is my pen: https://codepen.io/nenna_e/pen/LYENNrq?editors=1100#0

Also: On mobile the whole page is not static. Someone suggested to change the position
to static but that doesn’t fix the problem.

You have an Overflow limit to prevent the side scroll to read all of the information. Which is ok and not cause your problem.

This is your issue:

#main-doc {
  margin-bottom: 100px;
  margin-left: 360px;
  max-width: 980px;
  width: 100%;
}

#main-doc is 100% wide + 360px left margin.

you want width to be 100% - 360px, you’ll have to figure out how to calc that :wink: (hint)

1 Like