Content for Desktop/Tablet - Width Experiment
When I was developing a page that should only display on a desktop or a tablet with medium resolution
I noticed that the desktop section was displaying with a margin that I was not seeing before I upgraded my laptop that had
a larger screen.
The resolution on my new Asus laptop is 1920 by 1200px (16") the older Medion was also 1920 but by 1200px. The difference
was in the recommended scaling was 150% on a 14" display. The recommended scaling on the 16" display was 125%.
The differences could also be a Windows 10 Windows 11 thingy.
This should have a maximum width 250px and centred.
The default max-width is 980px
Content for Mobile
This should only display on a Mobile
This page will make no sense if viewed on a mobile phone.
It is an experiment on how things format on a larger screen and the use of the W3.css classes w3-content and w3-display.
Content on "Common Content" sections will be indexed regardless. This paragraph is in the "common" section.
w3-section and w3-content
I need to document these for myself.
w3-section - Adds an 16px top and bottom margin to an element
w3-content - Container for fixed size centered content - the default max-width is 980px
Top
About the Common Content
Some pages may require common content. This text should appear on all resolutions.