You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The notes on large (FullHD) screens are auto-wrapped at 47em leaving a large portion of empty white screen on right side. This is caused by the following line in notes.css:
max-width: 47em;
Please remove this static width limitation and enable fit-to-width behavior.
So we should add some CSS with a media query for big screen widths to properly center the content:
#app-content-container {
text-align: center;
}
.CodeMirror {
display: inline-block;
text-align: center;
margin-right: 125px; /* half of the app-navigation width, to offset a bit to the left so it’s centered related to viewport */
}
Activity
elpraga commentedon Mar 27, 2018
Could this be related to #177 ?
bszente commentedon Mar 28, 2018
I don't know if this is related to your issue. Can you please test, if removing this line from CSS fixes the rendering on Android?
elpraga commentedon Mar 28, 2018
I just tried that. It didn't fix my problem. Thanks for your help!
jancborchardt commentedon Jun 4, 2018
Right, on big screens it indeed looks a bit strange as it’s all left-aligned.
The reason we limit the width though is for legibility, see https://en.wikipedia.org/wiki/Line_length
So we should add some CSS with a media query for big screen widths to properly center the content:
[-]Fit text horizontally: please remove the "max-width: 47em" from CSS[/-][+]Fit text horizontally[/+]