side note works woo

irmak/thesis.md

@@ -161,7 +161,7 @@ Every reader starts from 1 and continues until 12, with a consecutive numeric or
 alt="knot words from Leeszaal" />
 </figure>
 
-<div class="loops">
+<section class="loops">
 ## Working End 
 ### Loop 1
 ### Why am I doing this?
@@ -214,7 +214,10 @@ me realise that it doesn’t have to be or even can be a perfect story.
 In the end with the experience I had with loss, I believe the story turned out to be an ode to
 remembering or might I say an ode to not being able to forget or an ode to the fear of forgetting
 
-### Loop 2 <sup><span class="margin-note"><div>9 <img src="../irmak/loop.png"></div><div>11<img src="../irmak/loop.png"></div><div>8 <img src="../irmak/loop.png"></div></div></span></sup>
+### Loop 2 
+
+<sup><span class="margin-note loop-note">9 11 8<img src="../irmak/loop.png"></span></sup>
+
 The effect of storytelling knowledge on kids’ development and creativity. What can
 we learn from open ended and multiple ending stories?
 
@@ -663,7 +666,7 @@ as a prototype was a breakthrough. I feel like my interest and desire to discove
 writing, reading and experiencing literature is ongoing and it was a beautiful journey so far. I am
 looking forward to making more knots on this long and mysterious string at hand.
 
-</div>
+</section>
 
 ## Bibliography
 Cope, B. and Kalantzis, M. (2009) ‘“multiliteracies”:

print/fairleads.css

@@ -1,7 +1,7 @@
 .loops{
 	margin-left: -15mm;
 	padding-left: 40mm;
-	background-image: url('../img/loopstest.png');
+	background-image: url('../irmak/strings.png');
 	background-size: 35mm 180mm;
 	background-repeat: no-repeat;
 }
@@ -17,7 +17,22 @@
         position: absolute;
 	margin-left: 15mm;
 	padding: 5mm 0;
-/*	text-align-last: justify;*/
+}
+.loops .margin-note.loop-note{
+	text-align: justify;
+	width: 25mm;
+	font-weight: 700;
+	color: black;
+	text-align-last: justify;
+}
+.loops .margin-note>div{
+	display: inline-flex;
+	flex-direction: column;
+	align-items: center;
+	width: 10mm;
+}
+.loops .margin-note>div:first-of-type{
+	margin-left:  -2.5mm;
 }
 .loops .note-call{
 	display: none;

print/index.html

@@ -2160,8 +2160,8 @@ numeric order, according to their color/mode.
 <img src="../images/../images/../irmak/map.png"
 alt="knot words from Leeszaal" />
 </figure>
-<section id="working-end" class="loops">
-<h2>Working End</h2>
+<section class="loops">
+<h2 id="working-end">Working End</h2>
 <h3 id="loop-1">Loop 1</h3>
 <h3 id="why-am-i-doing-this">Why am I doing this?</h3>
 <p>My desire to write a children’s book about grief and memory ignited
@@ -2223,20 +2223,12 @@ story.</p>
 <p>In the end with the experience I had with loss, I believe the story
 turned out to be an ode to remembering or might I say an ode to not
 being able to forget or an ode to the fear of forgetting</p>
-### Loop 2 <sup><span class="margin-note">
-<div>
-9 <img src="../images/../images/../irmak/loop.png">
-</div>
-<div>
-11<img src="../images/../images/../irmak/loop.png">
-</div>
-<div>
-8 <img src="../images/../images/../irmak/loop.png">
-</div>
-</section>
-<p></span></sup> The effect of storytelling knowledge on kids’
-development and creativity. What can we learn from open ended and
-multiple ending stories?</p>
+<h3 id="loop-2">Loop 2</h3>
+<p><sup><span class="margin-note loop-note">9 11
+8<img src="../images/../images/../irmak/loop.png"></span></sup></p>
+<p>The effect of storytelling knowledge on kids’ development and
+creativity. What can we learn from open ended and multiple ending
+stories?</p>
 <p>ability to form basic stories or to express their emotions through
 fictional characters or events. Children are not born with a wide
 vocabulary of emotions and expressions. They learn how to read, mimic
@@ -2765,7 +2757,7 @@ feel like my interest and desire to discover new ways of writing,
 reading and experiencing literature is ongoing and it was a beautiful
 journey so far. I am looking forward to making more knots on this long
 and mysterious string at hand.</p>
-</div>
+</section>
 <h2 id="bibliography">Bibliography</h2>
 <p>Cope, B. and Kalantzis, M. (2009) ‘“multiliteracies”: New Literacies,
 new learning’, Pedagogies: An International Journal, 4(3), pp. 164–195.