diff --git a/README.md b/README.md index 5743636..e21e631 100644 --- a/README.md +++ b/README.md @@ -24,4 +24,3 @@ - [MDN: Introduction to CSS Layout](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Introduction) (note: skip Grid, Table, and Multi-Column layouts) - [MDN: Layout in Normal Flow](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow) - [A List Apart: CSS Positioning 101](https://alistapart.com/article/css-positioning-101/) - diff --git a/my-styles.css b/my-styles.css index f7d02e4..ec4f5e7 100644 --- a/my-styles.css +++ b/my-styles.css @@ -1,4 +1,45 @@ /* Your Stylesheet */ - +#display-01 div{ + display: inline; + border: thin solid blue; + margin: 20px; +} +#display-02 span{ +display: block; +border: thin solid red; +} +#display-03 div{ + display: inline; + border: thin solid green; + width: 25px; + height: 25px; + padding: 25px; +} +#display-04>div:first-of-type { + position: fixed; +} +#display-05 a { + display: inline-block; + box-sizing: border-box; + background-color: grey; + width: 50%; + padding: 2%; + margin-left: 25% +} +#boxmodel-01 div { + display: inline-block; + box-sizing: content-box; + border: thick blue; + width: 25%; + padding: 25%; + margin-left: 25% +} +#boxmodel-02 div { + display: inline-block; + box-sizing: content-box; + border: thick blue; + width: 25%; + padding: 25%; + margin-left: 25% +} /* All your edits should go here */ -