diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..4592227 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,16 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + + + { + "type": "pwa-chrome", + "request": "launch", + "name": "Open index.html", + "file": "c:\\Users\\nizam\\OneDrive\\Desktop\\College spring 2021\\bootstrap-lab\\index.html" + } + ] +} \ No newline at end of file diff --git a/css/styles.css b/css/styles.css index 8b13789..90cc78a 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1 +1,104 @@ +.selector-for-some-widget { + box-sizing: content-box; + } + /* // Extra small devices (portrait phones, less than 576px) + // No media query for `xs` since this is the default in Bootstrap + + // Small devices (landscape phones, 576px and up) */ + html, body { + max-width: 100%; + overflow-x: hidden; +} +.container{ + position:relative; + padding: 0%; +} +.no-padding { + padding: 0 !important; +} +title{ + + text-align: center; + +} +h1{ + text-align: center; +} +.container-fluid{ + margin-left: 0%; + margin-right: 0%; +} +.text-block{ + position: absolute; + bottom:500px ; + top: 40px; + left: 250px; + right: 250px; + align-content: center; + background-color:black; + opacity: 0.5; + color: white; + /* padding-left: 20px; + padding-right: 20px; */ + margin-left: 0%; + margin-right: 0%; + + +} +.box{ + position: absolute; + + background-color:teal; + color: white; + /* width: 100%; + margin-left: 0%; + margin-right: 0%; + padding-bottom: 10px; */ + text-align: center; + width: 100%; + padding: auto; + + + + +} +/* body { + overflow-x:hidden; + } */ +.oval{ + border: 1px solid; + border-radius: 50%; + padding: 0%; + width: 250px; + height: 200px; + bottom: 20%; + +} + +/* .rounded-circle{ + border: 1px solid; + border-radius: 10%; + width: 20px; + height: 20px; + bottom: 20%; + } */ +.block{ + position: absolute; + background-color: grey; + color: white; + text-align:center; + margin-top: 5%; + margin-left: 0%; + margin-right: 0%; +/* + width: 100%; + left:0; + padding-left: 20px; + padding-right: 20px; + top:10%; */ + /* bottom: -200%; + padding-top: 10px; */ + /* // padding-bottom: 10px; */ + +} diff --git a/index.html b/index.html index e2bedec..8610deb 100644 --- a/index.html +++ b/index.html @@ -1,47 +1,132 @@ - Cookie Store + +
+ +
+
+ Cookie Store + + - + + + + +

Cookie Store

-

Cookie Store

- -

Buy our awesome cookies. All proceeds go to charity!

- -

The Cookies

+

Buy our awesome cookies. All proceeds go to charity!

+
+
+
+

The Cookies

+
+
+
+ +

Thin Mint Cookies

+

Tasty mint chocolate cookies

+ + + +
+
+

Peanut Butter Cookies

+

Yummy peanut buttery goodness!

+ +
+
+

Short Bread Cookies

+

Santa's favorite classic.

+ +
+
+

Smore's Cookies

+

Camp fire favorite!

+ -

Thin Mint Cookies

+
+
+
+ + +
+
+
+ +

About us

+
+ Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod + tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, + quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo + consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse + cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non + proident, sunt in culpa qui officia deserunt mollit anim id est laborum. +
+
+
+ +
+
+
+

Contact us

+

100 Broadway Avenue,
+ New York, NY 10001
+ (212) 555-1234

+
+
+
+ + + \ No newline at end of file