Less than 2 hours left to turn in assignment 6.
4 Likes
TEAM
Seven
“Seven” has the link, sorry it’s not too obvious 
I changed it a tiny bit so that it was
6 Likes
Unit 7: Span Sandwich
Calling all students!
@flyingCouch @lst-my-shp-sil @greekmyth @merinnie @Theora @deathinreverie @ValKayRee @hazelnuttys @panaceia @JJJ000YYY @Nablai @keen @W.L.Ink
Today’s assignment is a bit more tricky than our past few ones, so be sure to start this as soon as you can. On a somewhat related note, if you find yourself unable to keep up with the assignments, please let me know as soon as possible. There is no shame in dropping from this coding class. It’s not even a real class. It’s just a thread on a writing forum. It won’t hurt your future to drop. Real life comes first.
Up until this point, we’ve been able to do most of our coding with only a few spans. And while, that is okay, coding becomes much more advanced when you begin the art of nesting. Nesting is when you take a span and put it inside of another span. Here is a very basic example of what I mean: <span style="font-size:; display: block; background-color: tomato; height: 100px;"><span style="font-size:; display: block; background-color: mediumseagreen; height: 50px;"> </span>
When posted as code, the above chunk would look like the following:
This is an example of span nesting, or as I lovingly call it, a span sandwich. The span with background-color: tomato; is called the parent while the span with background-color: mediumseagreen; is the child. Any code that you specify in the parent span will also be applied to the child. Example: You specify color: gold; in the parent but not in the child and then you add text to the parent and the child span. Guess what color both of them will be? That’s right. Gold.
Take as much time as you need to play around with this before you submit. Once you feel comfortable, be sure to include all of the following in your design (yes, I will be checking these when I grade):
● a minimum of 4 spans (2 of which must be child spans)
● your choice of background-image or border-image (check unit 4 for a refresher)
● minimum two different fonts used in the design (list of websafe fonts can be found here)
● at least 3 different colors that don’t make me go blind (color palettes can be found here and here)
Direct reply to this message with your submission by October 5th 6pm PDT. Grades will be given shortly. If, at any point during this assignment you wish to ask a question, feel free to tag me and ask!
10 Likes
Edited: I can’t read, disregard the parent/child question.
4 spans is a total of 4 different codes (but combined into one)? (So 4 of these <span style=> blah </span> ?)
& do you need to close out each span with </span>
2 Likes
4 sets of <span> and </span> tags.
3 Likes
How do you do this?
<span style=> blah
This image:
Hope I’m making sense here, Lumi?
2 Likes
@astrophile I suggest you add the link of unit 4 so that people don’t have to scroll to post #232 
Something like this:
● your choice of background-image or border-image (check unit 4 for a refresher)
2 Likes
Post 6 has links to all of the past assignments.
2 Likes
I don’t understand what you’re asking.
2 Likes
Wait, this one:
Like how do you write code in the open and keep it as it is
2 Likes
Thanks Lumi! 
2 Likes
You highlight your code and then click the icon to the right of the quote icon in the tool bar. The icon looks like this: </>
2 Likes
Like this:
<span style="font-size: 13px; background-position: center; display:
Thanks a lot, Lumi! 
2 Likes
- Types of Anime - Shounen Shoujo
- Daily Reminders - Drink Water
Eat a Snack
Write
Read Something
Know That You Are Loved
And Most Importantly:
Love Yourself
Decided to turn in my assignment early for a change I also had two ideas in mind for this assignment and couldn’t choose so I went with both lol
7 Likes
randomness
flowers
clouds
9 Likes
Preferred Name:
Opal
Why do you want to learn coding?
It think it would be a great creative outlet.
Have you read the rules?
Ya.
Can you commit at least one hour a week to this?
Yes, I can!
Is there anything in particular you wish to learn?
You willing to teach us JavaScript?
Anything else I should know?
Nope!
2 Likes
I’m sorry but since the class is more than half over, I am not accepting new students at this time. You’re welcome to lurk and do the assignments on your own and post it in The Coding Playground (no talking to others allowed there) or The Coder’s Society (talking to others allowed here). However, you will not be added as a formal student.
3 Likes
Boop.Bloop.Bloop.Bloop.
5 Likes
Assignment 6 Reflection
Calling all students!
@flyingCouch @lst-my-shp-sil @greekmyth @merinnie @Theora @nyxarra @ValKayRee @hazelnuttys @panaceia @JJJ000YYY @Nablai @keen @W.L.Ink
From what I could tell, it looks like everyone’s understanding the material well so far and is able to create designs with code. If you find yourself struggling or unable to keep up with this coding class, please reach out to me as soon as you can. Otherwise, we’ll just keeping marching full speed ahead.
If you have any questions or concerns, don’t be afraid to reach out to me. If you want to discuss your grade, please reach out privately. I’ll be more than happy to clarify something for you, especially if it helps you reach a deeper understanding with the code. Anywho, hope you all have a good week!
| Student Name | Grade |
|---|---|
| flyx | E |
| lux | F (no submission received) |
| greeky | E |
| mina | F (no submission received) |
| theora | E |
| xérès | S |
| val | E |
| hazel | S |
| g-ane | F (no submission received) |
| joy | E |
| nab | S |
| keen | S |
| ink | E |
6 Likes
Lorum Ipsum
words go here
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Lorem ipsum dolor sit amet consectetur adipiscing elit. Velit scelerisque in dictum non consectetur a erat. Magna ac placerat vestibulum lectus mauris ultrices eros. Integer quis auctor elit sed vulputate mi sit amet mauris. Mi tempus imperdiet nulla malesuada pellentesque. Mattis vulputate enim nulla aliquet porttitor lacus luctus accumsan. Fames ac turpis egestas maecenas pharetra. Nisi est sit amet facilisis magna. Faucibus vitae aliquet nec ullamcorper sit amet risus nullam. Nulla posuere sollicitudin aliquam ultrices sagittis. Sapien faucibus et molestie ac feugiat sed lectus vestibulum. Purus non enim praesent elementum facilisis leo vel fringilla est. Aliquam ut porttitor leo a. Proin nibh nisl condimentum id. Quam nulla porttitor massa id neque aliquam vestibulum.
Fermentum odio eu feugiat pretium nibh ipsum consequat nisl vel. Dolor magna eget est lorem ipsum dolor sit amet consectetur. Nibh sed pulvinar proin gravida hendrerit. Sit amet volutpat consequat mauris nunc congue nisi vitae suscipit. Nec dui nunc mattis enim ut. Vitae ultricies leo integer malesuada nunc vel risus commodo viverra. Sed cras ornare arcu dui vivamus arcu felis bibendum. Aliquam ultrices sagittis orci a. Tristique nulla aliquet enim tortor. Aenean pharetra magna ac placerat vestibulum lectus. Habitant morbi tristique senectus et netus et malesuada fames ac. Adipiscing at in tellus integer feugiat scelerisque varius morbi enim. Aliquam purus sit amet luctus. Sed ullamcorper morbi tincidunt ornare massa eget. Vitae sapien pellentesque habitant morbi tristique senectus et.
Tellus pellentesque eu tincidunt tortor aliquam nulla facilisi cras fermentum. Amet nisl suscipit adipiscing bibendum est ultricies. Fames ac turpis egestas maecenas pharetra convallis posuere. Blandit cursus risus at ultrices mi tempus imperdiet. Nulla facilisi etiam dignissim diam quis enim lobortis. Egestas tellus rutrum tellus pellentesque eu tincidunt tortor. Mattis aliquam faucibus purus in. Odio tempor orci dapibus ultrices in iaculis nunc. Tellus mauris a diam maecenas sed. Risus nullam eget felis eget nunc lobortis mattis. Posuere urna nec tincidunt praesent semper feugiat nibh sed. Aliquet eget sit amet tellus cras. Neque convallis a cras semper auctor neque vitae.
Amet volutpat consequat mauris nunc congue nisi vitae suscipit tellus. Velit euismod in pellentesque massa placerat duis ultricies lacus sed. Id porta nibh venenatis cras sed felis eget velit aliquet. Sed viverra ipsum nunc aliquet. Augue ut lectus arcu bibendum at. Massa massa ultricies mi quis hendrerit dolor magna. Ac feugiat sed lectus vestibulum mattis ullamcorper. Dolor sit amet consectetur adipiscing elit ut. Urna et pharetra pharetra massa massa ultricies mi quis. Mauris nunc congue nisi vitae suscipit tellus.
+ coded by flyx +
5 Likes