diff --git a/src/css/styles.css b/src/css/styles.css index 2768ae0..c02b514 100644 --- a/src/css/styles.css +++ b/src/css/styles.css @@ -369,8 +369,7 @@ h6 { .lay-1-container { display: grid; - grid-template-areas: "a . b" - "c c b"; + grid-template-areas: "a . b" "c c b"; grid-template-columns: repeat(3 1fr); grid-gap: 1em; } @@ -387,9 +386,7 @@ h6 { display: grid; grid-template-columns: 1fr 3fr; grid-template-rows: 2fr 6fr 1fr; - grid-template-areas: "item-1 item-2" - "item-3 item-2" - "item-3 item-4"; + grid-template-areas: "item-1 item-2" "item-3 item-2" "item-3 item-4"; grid-gap: 1em; } .lay-2-item-1 { @@ -408,10 +405,7 @@ h6 { display: grid; grid-template-columns: 1fr 2fr 1fr; grid-template-rows: 1fr 6fr 3fr 1fr; - grid-template-areas: "item-1 item-2 item-3" - "item-1 item-2 item-3" - "item-1 item-2 item-3" - "item-1 item-4 item-3"; + grid-template-areas: "item-1 item-2 item-3" "item-1 item-2 item-3" "item-1 item-2 item-3" "item-1 item-4 item-3"; grid-gap: 1em; } .lay-3-item-1 { diff --git a/src/scss/styles.scss b/src/scss/styles.scss index 13cf4cb..0eca514 100644 --- a/src/scss/styles.scss +++ b/src/scss/styles.scss @@ -332,6 +332,7 @@ grid-template-columns: 7fr 3fr; grid-column-gap: 1em; } + //classes for grids of 4 columns 10%-40%-40%-10% using "fr" units .col-1-4-4-1{ @@ -549,6 +550,6 @@ grid-column-gap: 1em; grid-column:1/3; } - - - +.lay-7-item-bottom { + grid-column: 1/4; +}