Open soraraso42 opened 8 months ago
in defining layout for smaller screens the general grid-template area is such
intended to be 1 col 5 rows body { display: grid; grid-template-areas: "logo-section " "catch-copy-section " / "background-section" "apply-section" "footer-section"; } always renders as 2 cols 5 rows #footer-section { **grid-area: footer-section;** width:calc(100% -2px); **grid-area: footer;** /* removed because it is causing horizontal scroll bar */ /* width:calc(100% -2px); */ /* grid-area: footer; */ /* grid-area applied twice causing browser to calculate TWO cols */
body { display: grid; grid-template-areas: "logo-section " "catch-copy-section " / "background-section" "apply-section" "footer-section"; }
#footer-section { **grid-area: footer-section;** width:calc(100% -2px); **grid-area: footer;** /* removed because it is causing horizontal scroll bar */ /* width:calc(100% -2px); */ /* grid-area: footer; */ /* grid-area applied twice causing browser to calculate TWO cols */
in defining layout for smaller screens the general grid-template area is such
intended to be 1 col 5 rows
body { display: grid; grid-template-areas: "logo-section " "catch-copy-section " / "background-section" "apply-section" "footer-section"; }always renders as 2 cols 5 rows#footer-section { **grid-area: footer-section;** width:calc(100% -2px); **grid-area: footer;** /* removed because it is causing horizontal scroll bar */ /* width:calc(100% -2px); */ /* grid-area: footer; */ /* grid-area applied twice causing browser to calculate TWO cols */