From 77efffade0d0d9eaf82da289e007e2544a128d81 Mon Sep 17 00:00:00 2001 From: Bee C Date: Wed, 28 Mar 2018 21:51:00 -0400 Subject: [PATCH] worked on BEM, didn't get to constructors --- index.html | 31 +++++++++++++++++++++++++++++++ styles.css | 27 +++++++++++++++++++++++++++ 2 files changed, 58 insertions(+) diff --git a/index.html b/index.html index 39167c5..b136f97 100644 --- a/index.html +++ b/index.html @@ -1,9 +1,40 @@ + Introduction to the DOM + +
+
+
+ + + +
+ +

Header

+
+
+

Placeholder

+
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce risus nibh, gravida nec felis quis, facilisis facilisis lectus. Nulla ac orci pretium, condimentum orci quis, accumsan nisi. Aliquam erat volutpat. Curabitur cursus mattis libero, at viverra risus hendrerit quis. Fusce imperdiet tristique tortor non tincidunt. Mauris accumsan urna nec augue feugiat porta. Proin vitae magna in ex malesuada laoreet eget a nulla. Aliquam tristique et elit at consequat. In hac habitasse platea dictumst.

+
+
+
+

Placeholder

+
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce risus nibh, gravida nec felis quis, facilisis facilisis lectus. Nulla ac orci pretium, condimentum orci quis, accumsan nisi. Aliquam erat volutpat. Curabitur cursus mattis libero, at viverra risus hendrerit quis. Fusce imperdiet tristique tortor non tincidunt. Mauris accumsan urna nec augue feugiat porta. Proin vitae magna in ex malesuada laoreet eget a nulla. Aliquam tristique et elit at consequat. In hac habitasse platea dictumst.

+
+
+ + +
\ No newline at end of file diff --git a/styles.css b/styles.css index 997c895..bf1cbf7 100644 --- a/styles.css +++ b/styles.css @@ -6,3 +6,30 @@ body { min-width: 300px; margin: 0; } + +.Block{ + display:flex; + flex-wrap:wrap; + border: solid black 2px; + width:100%; +} +.Block__Header{ + display:flex; + justify-content: space-around; + align-items: center; + width:100%; +} + +.Block__Dropdown { + border: solid black 2px; + padding: 2px; +} + +.Block--Body{ + width:49.7%; + +} + +.Dropdown--Content { + display: none; +}