From 804bb41a2c079368af09cb6b4b83136fb2115399 Mon Sep 17 00:00:00 2001 From: Amarachukwu Ugoanusi Date: Wed, 9 Dec 2020 15:15:17 -0500 Subject: [PATCH] Lab 3 first commit --- index.html | 98 ++++++++++++++++++++++++++++++++++++++++++++++++++ stylesheet.css | 62 ++++++++++++++++++++++++++++++++ 2 files changed, 160 insertions(+) create mode 100644 index.html create mode 100644 stylesheet.css diff --git a/index.html b/index.html new file mode 100644 index 0000000..0d039ef --- /dev/null +++ b/index.html @@ -0,0 +1,98 @@ + + + + + + + Pricing Lab + + + + + +
+

Company name

+ +
+

Pricing

+

There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour + .

+
+
+
+

Free

+

$0 / mo

+
    +
  • 10 users included
    • +
  • 2GB of storage
    • +
  • Email support
    • +
  • Helpcenter access
    • + +
+ +
+
+

Pro

+

$15 / mo

+
    +
  • 20 users included
    • +
  • 10GB of storage
    • +
  • Priority email support
    • +
  • Helpcenter access
    • + +
+ +
+
+

Enterprise

+

$29 / mo

+
    +
  • 30 users included
    • +
  • 15GB of storage
    • +
  • Phone and email support
    • +
  • Helpcenter access
    • + +
+ +
+
+ +
+ + + + \ No newline at end of file diff --git a/stylesheet.css b/stylesheet.css new file mode 100644 index 0000000..7368e28 --- /dev/null +++ b/stylesheet.css @@ -0,0 +1,62 @@ +.grid{ + + display:grid; + grid-template-areas: + "header . nav" + ". pricing ." + "flexcard flexcard flexcard" + "footer footer footer"; + +} +.flexcard{ + + display:flex; + flex-wrap:wrap; + justify-content: space-evenly; + grid-area:flexcard; +} + +nav{ + grid-area:nav; + +} + +header{ + grid-area:header; + +} + /* #free{ +grid-area:free; + +} +#pro{ + grid-area:pro; + +} +#enterprise{ + grid-area:enterprise; + +} */ +footer{ + + grid-area:footer; + display:flex; + flex-wrap:wrap; + justify-content: space-evenly; + + +} +.pricing{ + grid-area:pricing; + text-align:center; + +} +ul{ + list-style: none; + padding:0; + +} +li{ +padding:3px 0; + +} \ No newline at end of file