Non-hovered code block affects width of main content wrapper

[ang-zeyu]

Tell us about your environment

• MarkBind Version: Latest master

What did you do? Please include the actual source code causing the issue.

What did you expect to happen?
The width of the main container should not be affected by a code fence with a line longer than the content wrapper width, and the page nav should not go "out of the page" due to this

[nbriannl]

Preliminary examination:
Bug appears on some pages and not on others.
https://deploy-preview-1075--markbind-master.netlify.com/userguide/usingplugins
https://deploy-preview-1075--markbind-master.netlify.com/userguide/usingcomponents

[acjh]

The difference is that:

• usingplugins has only 1 code block that overflows, while
• usingcomponents has more than 1 code block that overflows.

The fix is to define a min-width for #content-wrapper so that flex: 1 can shrink correctly.
Let's add min-width: 0. We can remove width: 100%, which is ignored since we use flex.

markbind/asset/css/markbind.css

Lines 142 to 150 in 3a41773

	#content-wrapper {
	flex: 1;
	margin: 0 auto;
	max-width: 1000px;
	padding: 0 20px;
	transition: 0.4s;
	width: 100%;
	-webkit-transition: 0.4s;
	}