From 08353d8ab3474f688b018d6502ace2ab03bd1964 Mon Sep 17 00:00:00 2001 From: compukid Date: Fri, 10 May 2024 23:49:48 -0400 Subject: [PATCH] activity 4.4.3 --- activity_4.4.3/index.html | 29 +++++++++++++++++++++++++++++ activity_4.4.3/style.css | 24 ++++++++++++++++++++++++ 2 files changed, 53 insertions(+) create mode 100644 activity_4.4.3/index.html create mode 100644 activity_4.4.3/style.css diff --git a/activity_4.4.3/index.html b/activity_4.4.3/index.html new file mode 100644 index 0000000..5fe1941 --- /dev/null +++ b/activity_4.4.3/index.html @@ -0,0 +1,29 @@ + + + + + Practice with Relative Positioning + + + + +

This is the main title

+

this is the subtitle

+
+
+

subsection title

+

+ The "position" property sets the algorithm for how the Web browser will compute the way the HTML elements are placed on the page. There are four different value options for the position property: +

+
+
+

subsection title

+

+ Once you've set the position to "relative" that frees you up to set the top, right, bottom and left properties- otherwise known as the "box offsets". These properties specify the distance between this object and its normal static position and the corner of the box that we are specifying. + +For example, if we set the "left" to be "30px", it will move the element 30px to the right away from the left of where it was placed by default. +

+
+
+ + \ No newline at end of file diff --git a/activity_4.4.3/style.css b/activity_4.4.3/style.css new file mode 100644 index 0000000..841d4e9 --- /dev/null +++ b/activity_4.4.3/style.css @@ -0,0 +1,24 @@ +body { + background-color: #EFEFEF; + color: #A9A9A9; + font-family: "Book Antiqua", serif; + } + h1 { + color: #FF3B3F; + } + h2 { + position: relative; + left: 20px; + } + div { + background-color: #CAEBF2; + width: 80%; + position: relative; + left: 3em; + } + h3 { + color: #FF3B3F; + } + p { + width: 90%; + } \ No newline at end of file