i posted code that the site doesn’t support (i.e. youtube embed video {iframe})
3 Likes
removed
3 Likes
removed
4 Likes
No worries! I’m glad you’re trying to help solve it:)
3 Likes
ooh, does it work for you? 
3 Likes
I can see it normally, something like this:
Or this: (probably cause I’m on my tablet and can rotate the screen)
2 Likes
are you on mobile? and thank you!
edit: yup, it looks the way it should for the most part xD thanks again! 
3 Likes
no problem, glad I could help!
3 Likes
omg that’s pretty much perfect, i didn’t know you could drag it like that?? i would love to have the code for that!! tysm for fixing it :’’)
3 Likes
Yayy! 
added a bit of code to do that xD
I’ll PM it to you in a moment
My pleasure! 
4 Likes
sorry to bother you but could I also see the code? 
2 Likes
sure! gimme a second
3 Likes
Thank you!! 
2 Likes
Click on the pause button 
A Music Playlist
1:11 ━━|━━━━━━━━━ 5:37⇆ ◁ ❚❚ ▷ ↺
now playing: Morceaux de Salon, Romance, Op. 6 No. 1 – Rachmaninoff Queue: ≡ Taxidermy of deer human – Feryquitous
≡ The Letter (ft. Katali) – Sakuzyo
≡ Élégie in E Flat Minor, Op. 3 No. 1 – Rachmaninoff
≡ Waltz in A Minor, Op. Posthumous – Chopin
≡ Platinum – Sta
≡ Nocturne in E Flat Major, Op. 9 No. 2 – Chopin
≡ Prelude in E Minor, Op. 28 No. 4 – Chopin
≡ Gymnopédie No. 1 – Satie
≡ Vindicta – Jesse Bullard
⭐︎ ✧ coded by stella_vigo ✧ ⭐︎
Oh, and the songs in the scroll box on the right are also links.
raw code
<span style="font-size:; display: block; font-family: Times New Roman; margin: auto; padding: 20px; background-color: black; color: white;">
<div align="center">
<span style="font-size: 5vmin; display: block; margin: auto; letter-spacing: 8px;">A Music Playlist</span>
</div>
<span style="font-size:; display: flex; width: 100%; margin-top: 3vmin; text-align: center;">
<span style="font-size: display: inline-block; font-family: Garamond; border: 3px transparent; width: 44%; height: 35vmin; background-image: url('https://external-content.duckduckgo.com/iu/?u=http%3A%2F%2Fdirect.rhapsody.com%2Fimageserver%2Fimages%2FAlb.46314971%2F500x500.jpg&f=1&nofb=1'); background-repeat: no-repeat; background-size: 25vmin; background-position: top; margin: auto; margin-left: 4%; margin-right: 4%; line-height: 1.2">
<span style="font-size: 1vmin; display: block; position: relative; bottom: -27vmin;">
1:11 ━━|━━━━━━━━━ 5:37<br><br>
⇆ ◁ <a href="https://youtu.be/eTwtKCBX6KQ?t=71"><font color=#ffffff>❚❚</font></a> ▷ ↺<br><br>
<span style="font-size:; display: block; font-family: Garamond; margin: auto; letter-spacing: 1px; padding-left: 2vmin; padding-right: 2.2vmin; line-height: 1.5">now playing: Morceaux de Salon, Romance, Op. 6 No. 1 – Rachmaninoff</span>
</span></span>
<span style="font-size:; display: inline-block; font-family: Garamond; width: 44%; height: 35vmin; margin: auto; margin-left: 4%; margin-right: 4%; text-align: left;"><span style="font-size: 3vmin; display: block; font-family: Garamond; letter-spacing: 1.2px; margin: auto;">Queue:</span>
<span style="font-size: 1.8vmin; display: block; letter-spacing: 0.8px; height: 29vmin; overflow-y: scroll; padding-left: 1vmin; padding-right: 0.5vmin; line-height: 1.5; position: relative; bottom: -1vmin; padding-bottom: 0.5vmin;">
≡ <a href="https://youtu.be/ERORPASus-Y"><font color=#ffffff>Taxidermy of deer human – Feryquitous</font></a><br>
≡ <a href="https://youtu.be/qrkCW7GZhlo"><font color=#ffffff>The Letter (ft. Katali) – Sakuzyo</font></a><br>
≡ <a href="https://youtu.be/Dd5HZfeZsmM"><font color=#ffffff>Élégie in E Flat Minor, Op. 3 No. 1 – Rachmaninoff</font></a><br>
≡ <a href="https://youtu.be/Wp2xI1Pr4nQ"><font color=#ffffff>Waltz in A Minor, Op. Posthumous – Chopin</font></a><br>
≡ <a href="https://youtu.be/1at2PhFVwRM"><font color=#ffffff>Platinum – Sta</font></a><br>
≡ <a href="https://youtu.be/Mg-LX6K6W5o"><font color=#ffffff>Nocturne in E Flat Major, Op. 9 No. 2 – Chopin</font></a><br>
≡ <a href="https://youtu.be/x5r-YMOBRBM"><font color=#ffffff>Prelude in E Minor, Op. 28 No. 4 – Chopin</font></a><br>
≡ <a href="https://youtu.be/eMnxjdGTK4w"><font color=#ffffff>Gymnopédie No. 1 – Satie</font></a><br>
≡ <a href="https://youtu.be/oX4eXbNnTSo"><font color=#ffffff>Vindicta – Jesse Bullard</font></a><br>
</span></span></span><br>
<span style="font-size: 1vmin; font-family: Garamond; display: block; margin: auto; text-align: center; color: #e08080; letter-spacing: 1.2px;">⭐︎ ✧ coded by stella_vigo ✧ ⭐︎</span></span>
EDIT: Trying to make it more mobile friendly 
EDIT 2: It’s more mobile friendly now. I just changed the heights to vmin instead of vh
For reference, this is how it looks like on my phone:
5 Likes
It is!
3 Likes
So the “music player” I coded yesterday doesn’t look that good on mobile compared to on my laptop, so I coded a different one that’s more mobile friendly 
thoughts? The song titles are links btw.
⭐︎ ✧ coded by stella_vigo ✧ ⭐︎
raw code
<div data-theme-slick="1">
<span style="font-size: 20px; display: block; font-family: Arial; height: 500px; overflow: hidden; background-color: black; color: white;"><span style="font-size: 20px; display: block; position: relative; margin-top: 0px; pointer-events: none;">
<details class="elided" open>
<summary>
<span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px;">▷▷</span></summary><span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://lh3.googleusercontent.com/l_ZuuFJ3LWzRX5pc8HLVotMSpjEuLmLeUbRitrhVOjfrUOCytbWJUEZo39k6qVQN88iu8QhxYDEXsJ0=w544-h544-l90-rj'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/fA3jFMDBiu4?t=59"><font color=white>Kashmir – Marcin</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:59 —————|—————————— 2:58</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 20px; display: block; position: relative; margin-top: -2px; pointer-events: none;">
<details class="elided" open>
<summary><span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px;">▷▷</span></summary>
<span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://i.scdn.co/image/ab67616d0000b273484d121f0e2d2caf87d5d10b'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/pfEZW-1eDl8"><font color=white>Airplanes (feat. Hayley Williams) – B.o.B</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 3:00</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 20px; display: block; position: relative; margin-top: -2px; pointer-events: none;">
<details class="elided" open>
<summary><span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px">▷▷</span></summary>
<span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://i.scdn.co/image/ab67616d0000b273241e4fe75732c9c4b49b94c3'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/AGDlC3VDVCc"><font color=white>History – One Direction</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 3:08</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 20px; display: block; position: relative; margin-top: -2px; pointer-events: none;">
<details class="elided" open>
<summary><span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px;">▷▷</span></summary>
<span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://i1.sndcdn.com/artworks-36zI8jgvDaTbHsIh-t4IkMg-t500x500.jpg'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/d4n0WLUUlOI"><font color=white>Detour – 20syl</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 0:59</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 20px; display: block; position: relative; margin-top: -2px; pointer-events: none;">
<details class="elided" open>
<summary><span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px;">▷▷</span></summary><span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://i.scdn.co/image/ab67616d0000b273785d4e702802da500fc78b32'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/KWLGyeg74es"><font color=white>Fireflies – Owl City</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 3:48</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://lh3.googleusercontent.com/Di7n2iVRo24KVbiz9u6NInDPPJEFREEjADdrFJ_hf2IMtHIBcekW6F9WKm3EG6HGAoNywJYpc0A4cpQy=w544-h544-l90-rj'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/VHEKvMj04Qk"><font color=white>Chopin Nocturne – Marcin</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 4:40</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details>
</div>
<br>
<span style="font-size: 12px; font-family: Garamond; display: block; margin: auto; text-align: center; color: #e08080; letter-spacing: 1.2px;">`⭐︎` ✧ coded by stella_vigo ✧ `⭐︎`</span>
EDIT: Also, how do you make links work? <a href="link"></a> doesn’t work on the first to second-to-last slides for some reason.
EDIT 2: Since I can’t get links to work in a slideshow, I’ve coded something new. All the song names are links btw.
≡ Say Something – A Great Big World
≡ My Funny Valentine – Chet Baker
≡ Abandoned – Sakuzyo
≡ Giant Steps – John Coltrane
≡ Waltz in A Flat Major, Op. 69 No. 1 – Chopin
≡ Six Morceaux, Scherzo, Op. 11 No. 2 – Rachmaninoff
≡ Nocturne in E Flat Major, Op. 9 No. 2 – Chopin
⭐︎ ✧ coded by stella_vigo ✧ ⭐︎
≡ My Funny Valentine – Chet Baker
≡ Abandoned – Sakuzyo
≡ Giant Steps – John Coltrane
≡ Waltz in A Flat Major, Op. 69 No. 1 – Chopin
≡ Six Morceaux, Scherzo, Op. 11 No. 2 – Rachmaninoff
≡ Nocturne in E Flat Major, Op. 9 No. 2 – Chopin
more raw code
<span style="font-size:; display: block; font-family: Tahoma; background-image: linear-gradient(to bottom right, black, #1f1f1f, #101010, #0f0f0f, #0a0a0a, #090909, black); width: 250px; margin: auto; padding: 10px; color: white;">
<div align="center">
<span style="font-size:; display: block; background-image: url('https://i.scdn.co/image/ab67616d0000b273df63d8d198ca0ab4d3d2ecdd'); background-repeat: no-repeat; background-size: 175px 175px; background-position: center; margin: auto; margin-top: 20px; width: 180px; height: 180px;"></span>
<span style="font-size: 10px; display: block; letter-spacing: 1.2px; margin: auto; margin-top: 20px">now playing</span>
<span style="font-size: 15px; display: block; letter-spacing: 1px; margin: auto; margin-top: 20px;"><a href="https://youtu.be/3CmkVQ4Tx2U?t=31"><font color="white">Kaitul – Feryquitous</font></a></span>
<span style="font-size: 10px; display: block; margin: auto; margin-top: 20px;"> 0:31 ——|————————————— 3:49</span>
<span style="font-size: 10px; display: block; margin: auto; margin-top: 12px;"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; margin: auto; margin-top: 12px;"> v o l u m e : ——————————〇——— </span>
</div>
<div align="left">
<span style="font-size: 12px; display: block; width: 175px; height: 100px; margin: auto; margin-top: 22px; overflow-y: scroll; letter-spacing: 1.2px; padding: 5px;">
≡ <a href="https://youtu.be/KHIMIa5Lzxk"><font color="white">Say Something – A Great Big World</font></a><br>
≡ <a href="https://youtu.be/ni9Cp9mOOOg"><font color="white">My Funny Valentine – Chet Baker</font></a><br>
≡ <a href="https://youtu.be/HUecHbneUsI"><font color="white">Abandoned – Sakuzyo</font></a><br>
≡ <a href="https://youtu.be/g8QnKWPYRCs"><font color="white">Giant Steps – John Coltrane</font></a><br>
≡ <a href="https://youtu.be/b5fcXlbyn60"><font color="white">Waltz in A Flat Major, Op. 69 No. 1 – Chopin</font></a><br>
≡ <a href="https://youtu.be/-IAhEXIYJWA"><font color="white">Six Morceaux, Scherzo, Op. 11 No. 2 – Rachmaninoff</font></a><br>
≡ <a href="https://youtu.be/Mg-LX6K6W5o"><font color="white">Nocturne in E Flat Major, Op. 9 No. 2 – Chopin</font></a><br>
</span>
</div>
<span style="font-size: 8px; font-family: Garamond; display: block; margin: auto; text-align: center; color: #e08080; letter-spacing: 1.2px; margin-top: 18px; margin-bottom: 15px;">⭐︎ ✧ coded by stella_vigo ✧ ⭐︎</span>
</span>
EDIT 3: Thank you @/SockMonster1 and @/zeroinfinyx for helping me understand why the links weren’t working in the slideshow! They work now
3 Likes
@wednesday here’s an excerpt (more like a prophecy) from Flight of Kestrel 
As evil shall fall
Stand up high
And listen all
Peace is necessary,
As is sight
With one of fire
And one of flight
Of varied pasts
And varied times
Through large distances;
Magik and mortal entwined
‘Tis a game,
A cruel twisted trick
Fate will only take
One single pick
Chaos rising,
Pending death
For a spider is patient
As it spins it’s net
Never stop —
Raising storms
A blood-red dish,
A crimson mourn
Watch for secrets,
Watch for show
No one knows
Their hidden foe
When different stories
All merge together
Who really is
The one true successor?
A war will come
When they must join together
If discarded, the world will fall
Into ash and darkness, forever
raw code
<span style="font-size:; display: block; position: relative; width: 100%; max-width: 100vh;">
<span style="font-size:; display: block; padding-bottom: 50%;"></span>
<span style="font-size:; display: block; width: 80%; height: 75%; background: #406A53; position: absolute; top: 6%; left: 5%; margin-right: 5%; box-shadow: 8px 10px 13px -5px #284A37;"></span>
<span style="font-size:; display: block; width: 45%; height: 47%; background: linear-gradient(to right, #548F6F 0%, #629B7C 100%); position: absolute; top: 10%; left: 32%; padding: 5%; box-shadow: 8px 10px 15px -5px #284A37; overflow-y: scroll;">
<span style="font-size: 33px; letter-spacing: 2px; margin: auto; letter-spacing: 2px; line-height: 1.5; text-align: left; text-transform: none; font-family: tangerine; color: black; text-shadow: 2px 2px #4E7C6C; color: #275243;"> The War Prophecy </span>
<span style="font-size:; display: block; width: 100%; border-top: 1px solid #406A53; margin: 3.5% 0%;"> </span>
<span style="font-size: 10px; text-transform: none; letter-spacing: 1.5px; text-align: left; text-shadow: none; line-height: 15px; font-family: papyrus; color: #275243;"> Four may rise, <br> As evil shall fall <br> Stand up high <br> And listen all <br><br> Peace is necessary, <br> As is sight <br> With one of fire <br> And one of flight <br><br> Of varied pasts <br> And varied times <br> Through large distances; <br> Magik and mortal entwined <br><br> ‘Tis a game, <br> A cruel twisted trick <br> Fate will only take <br> One single pick <br><br> Chaos rising, <br> Pending death <br> For a spider is patient <br> As it spins it’s net <br><br> Never stop — <br> Raising storms <br> A blood-red dish, <br> A crimson mourn <br><br> Watch for secrets, <br> Watch for show <br> No one knows <br> Their hidden foe <br><br> When different stories <br> All merge together <br> Who really is <br> The one true successor? <br><br> A war will come <br> When they must join together <br> If discarded, the world will fall <br> Into ash and darkness, forever
</span>
</span>
<span style="font-size:; display: block; width: 32%; height: 83%; background: url(https://i.pinimg.com/236x/05/b3/16/05b316adc4cdaa5d53d008541898eacb.jpg) center; background-size: fill; position: absolute; top: 0; left: 2%; box-shadow: 8px 10px 15px -5px #284A37;">
</span>
</span>
3 Likes
all your codes are so pretty 
OOOO I LIKE ITTTTT I CANT WAIT JHLUGKJ :OOOO
2 Likes
Aw, thank you! I’ll be able to rewrite and edit it before September (that is, if I’m productive though 
)
2 Likes