<div class="quoteheader"><div class="topslice_quote"><a href="https://elliquiy.com/forums/index.php?topic=290221.msg15184236#msg15184236">Quote from: Steffy on November 29, 2019, 09:54:01 am</a></div></div><blockquote class="bbc_standard_quote"><span class="bbc_font" style="font-family: comic sans ms;">And since I also enjoy the specific, I like to imagine everyone enjoying their holidays, wherever they may be.  (See immediately below for what I’ve imagined for Al).<br/><br/>(https://www.mediafire.com/convkey/0f13/j1glooxih7ae6o36g.jpg)</span></blockquote><div class="quotefooter"><div class="botslice_quote"></div></div><br/>Damn, Steffy, you are incorrigible!<br/><br/><hr/><br/>Time to add to the spell book.<br/><br/>The theme of the day is:<strong>framing</strong>.<br/><br/>Let us take a digging song and frame it with digging implements:<br/><br/><table class="bbc_table"><tbody><tr><td>⛏️</td><td>⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Brothers of the mine rejoice!</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Swing, swing, swing with me</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Raise your pick and raise your voice!</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Sing, sing, sing with me</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Down and down into the deep</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Who knows what we'll find beneath?</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Diamonds, rubies, gold and more</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Hidden in the mountain store</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Born underground, suckled from a teat of stone</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Raised in the dark, the safety of our mountain home</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Skin made of iron, steel in our bones</td><td>⛏️</td></tr><tr><td>⛏️</td><td>To dig and dig makes us free</td><td>⛏️</td></tr><tr><td>⛏️</td><td>Come on brothers sing with me!</td><td>⛏️</td></tr><tr><td>⛏️</td><td>⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️</td><td>⛏️</td></tr></tbody></table><br/><div class="spoiler_container"><div class="spoiler_header" onclick="hideSecond (this);" role="button">Code and explanation</div><div class="spoiler_body"><div class="codeheader">Code: <a class="codeoperation" href="javascript:void(0);" onclick="return smfSelectText(this);">[Select]</a></div><pre style="margin: 0; padding: 0;"><code class="bbc_code">[table]<br/>[tr][td]⛏️[/td][td]⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Brothers of the mine rejoice![/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Swing, swing, swing with me[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Raise your pick and raise your voice![/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Sing, sing, sing with me[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Down and down into the deep[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Who knows what we'll find beneath?[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Diamonds, rubies, gold and more[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Hidden in the mountain store[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Born underground, suckled from a teat of stone[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Raised in the dark, the safety of our mountain home[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Skin made of iron, steel in our bones[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]To dig and dig makes us free[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]Come on brothers sing with me![/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️[/td][td]⛏️[/td][/tr]<br/>[/table]</code></pre><br/>Nothing much to it, a simple 3-column table, with the top and bottom rows setting the width.</div></div><br/><br/><br/>But what if we don't want the vertical spacing between the lines that comes with putting each line in a row?  We could combine cells:<br/><br/><table class="bbc_table"><tbody><tr><td>⛏️</td><td>⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️</td><td>⛏️</td></tr><tr><td>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️</td><td>Brothers of the mine rejoice!<br/>Swing, swing, swing with me<br/>Raise your pick and raise your voice!<br/>Sing, sing, sing with me<br/>Down and down into the deep<br/>Who knows what we'll find beneath?<br/>Diamonds, rubies, gold and more<br/>Hidden in the mountain store<br/>Born underground, suckled from a teat of stone<br/>Raised in the dark, the safety of our mountain home<br/>Skin made of iron, steel in our bones<br/>To dig and dig makes us free<br/>Come on brothers sing with me!</td><td>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️</td></tr><tr><td>⛏️</td><td>⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️</td><td>⛏️</td></tr></tbody></table><br/><div class="spoiler_container"><div class="spoiler_header" onclick="hideSecond (this);" role="button">Code and explanation</div><div class="spoiler_body"><div class="codeheader">Code: <a class="codeoperation" href="javascript:void(0);" onclick="return smfSelectText(this);">[Select]</a></div><pre style="margin: 0; padding: 0;"><code class="bbc_code">[table][tr][td]⛏️[/td][td]⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️[/td][td]⛏️[/td][/tr]<br/>[tr][td]⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️[/td][td]Brothers of the mine rejoice!<br/>Swing, swing, swing with me<br/>Raise your pick and raise your voice!<br/>Sing, sing, sing with me<br/>Down and down into the deep<br/>Who knows what we'll find beneath?<br/>Diamonds, rubies, gold and more<br/>Hidden in the mountain store<br/>Born underground, suckled from a teat of stone<br/>Raised in the dark, the safety of our mountain home<br/>Skin made of iron, steel in our bones<br/>To dig and dig makes us free<br/>Come on brothers sing with me![/td][td]⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️[/td][/tr]<br/>[tr][td]⛏️[/td][td]⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️[/td][td]⛏️[/td][/tr][/table]</code></pre><br/>Much less neat, but the result is more compact.</div></div><br/><br/><br/>Or a slightly different spacing:<br/><br/><table class="bbc_table"><tbody><tr><td>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️</td><td>⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️<br/>Brothers of the mine rejoice!<br/>Swing, swing, swing with me<br/>Raise your pick and raise your voice!<br/>Sing, sing, sing with me<br/>Down and down into the deep<br/>Who knows what we'll find beneath?<br/>Diamonds, rubies, gold and more<br/>Hidden in the mountain store<br/>Born underground, suckled from a teat of stone<br/>Raised in the dark, the safety of our mountain home<br/>Skin made of iron, steel in our bones<br/>To dig and dig makes us free<br/>Come on brothers sing with me!<br/>⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️</td><td>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️</td></tr></tbody></table><br/><div class="spoiler_container"><div class="spoiler_header" onclick="hideSecond (this);" role="button">Code and explanation</div><div class="spoiler_body"><div class="codeheader">Code: <a class="codeoperation" href="javascript:void(0);" onclick="return smfSelectText(this);">[Select]</a></div><pre style="margin: 0; padding: 0;"><code class="bbc_code">[table][tr][td]⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️[/td][td]⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️<br/>Brothers of the mine rejoice!<br/>Swing, swing, swing with me<br/>Raise your pick and raise your voice!<br/>Sing, sing, sing with me<br/>Down and down into the deep<br/>Who knows what we'll find beneath?<br/>Diamonds, rubies, gold and more<br/>Hidden in the mountain store<br/>Born underground, suckled from a teat of stone<br/>Raised in the dark, the safety of our mountain home<br/>Skin made of iron, steel in our bones<br/>To dig and dig makes us free<br/>Come on brothers sing with me!<br/>⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️⛏️[/td][td]⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️<br/>⛏️[/td][/tr][/table]</code></pre><br/>Minor visual differences, but basically the same.</div></div><br/><br/><br/>But what if we wanted a solid border?  This too can be done:<br/><br/><table class="bbc_table"><tbody><tr><td>(https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg)<br/><div class="floatleft">(https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg)</div><div class="floatright">(https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg)</div><table class="bbc_table"><tbody><tr><td>Brothers of the mine rejoice!<br/>Swing, swing, swing with me<br/>Raise your pick and raise your voice!<br/>Sing, sing, sing with me<br/>Down and down into the deep<br/>Who knows what we'll find beneath?<br/>Diamonds, rubies, gold and more<br/>Hidden in the mountain store<br/>Born underground, suckled from a teat of stone<br/>Raised in the dark, the safety of our mountain home<br/>Skin made of iron, steel in our bones<br/>To dig and dig makes us free<br/>Come on brothers sing with me!</td></tr></tbody></table>(https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg)</td></tr></tbody></table><br/><div class="spoiler_container"><div class="spoiler_header" onclick="hideSecond (this);" role="button">Code and explanation</div><div class="spoiler_body"><div class="codeheader">Code: <a class="codeoperation" href="javascript:void(0);" onclick="return smfSelectText(this);">[Select]</a></div><pre style="margin: 0; padding: 0;"><code class="bbc_code">[table][tr][td][img height=10 width=357]https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg[/img]<br/>[floatleft][img height=236 width=10]https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg[/img][/floatleft][floatright][img height=236 width=10]https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg[/img][/floatright][table][tr][td]Brothers of the mine rejoice!<br/>Swing, swing, swing with me<br/>Raise your pick and raise your voice!<br/>Sing, sing, sing with me<br/>Down and down into the deep<br/>Who knows what we'll find beneath?<br/>Diamonds, rubies, gold and more<br/>Hidden in the mountain store<br/>Born underground, suckled from a teat of stone<br/>Raised in the dark, the safety of our mountain home<br/>Skin made of iron, steel in our bones<br/>To dig and dig makes us free<br/>Come on brothers sing with me![/td][/tr][/table][img height=10 width=357]https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg[/img][/td][/tr][/table]</code></pre><br/>OK, this one is a little convoluted.<br/>First, we create the top horizontal bar using a solid-colour image stretched to the desired dimensions.<br/>Then we similarly create the left and right vertical bars using the <span class="bbc_font" style="font-family: courier;">[floatleft]</span> and <span class="bbc_font" style="font-family: courier;">[floatright]</span> tags.<br/>Then we put the text, surrounded by a single-cell table to create a bit of spacing between the borders and the text.<br/>Then we put the bottom horizontal bar, similarly to the top bar above.<br/>And finally, we wrap everything in another single-cell table to prevent the right vertical bar from escaping to the end of the window.<br/><br/>The biggest problem is getting the sizes of the bars just right, and then they may still be off for somebody that uses magnification.<br/>This can be overcome by adding vertical and horizontal padding to the text by placing it in the middle of a 3- or 9-cell table.</div></div><br/><br/><br/>And a slight variation:<br/><br/><div class="floatleft">(https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg)<br/><div class="floatleft">(https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg)</div><div class="floatright">(https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg)</div><table class="bbc_table"><tbody><tr><td>Brothers of the mine rejoice!<br/>Swing, swing, swing with me<br/>Raise your pick and raise your voice!<br/>Sing, sing, sing with me<br/>Down and down into the deep<br/>Who knows what we'll find beneath?<br/>Diamonds, rubies, gold and more<br/>Hidden in the mountain store<br/>Born underground, suckled from a teat of stone<br/>Raised in the dark, the safety of our mountain home<br/>Skin made of iron, steel in our bones<br/>To dig and dig makes us free<br/>Come on brothers sing with me!</td></tr></tbody></table><span class="bbc_size" style="font-size: 1pt;"><br class="clear"/>(https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg)</span></div><br class="clear_left"/><br/><div class="spoiler_container"><div class="spoiler_header" onclick="hideSecond (this);" role="button">Code and explanation</div><div class="spoiler_body"><div class="codeheader">Code: <a class="codeoperation" href="javascript:void(0);" onclick="return smfSelectText(this);">[Select]</a></div><pre style="margin: 0; padding: 0;"><code class="bbc_code">[floatleft][img height=10 width=357]https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg[/img]<br/>[floatleft][img height=236 width=10]https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg[/img][/floatleft][floatright][img height=236 width=10]https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg[/img][/floatright][table][tr][td]Brothers of the mine rejoice!<br/>Swing, swing, swing with me<br/>Raise your pick and raise your voice!<br/>Sing, sing, sing with me<br/>Down and down into the deep<br/>Who knows what we'll find beneath?<br/>Diamonds, rubies, gold and more<br/>Hidden in the mountain store<br/>Born underground, suckled from a teat of stone<br/>Raised in the dark, the safety of our mountain home<br/>Skin made of iron, steel in our bones<br/>To dig and dig makes us free<br/>Come on brothers sing with me![/td][/tr][/table][size=1pt][clearboth][img height=10 width=357]https://www.solidbackgrounds.com/images/125x125/125x125-safety-orange-blaze-orange-solid-color-background.jpg[/img][/floatleft][clearleft]</code></pre><br/>Very similar to the above, except for using the <span class="bbc_font" style="font-family: courier;">[floatleft]</span> tag instead of an outer surrounding table.<br/>There could be minor visual differences in rendering.</div></div><br/><br/><br/>Now, the last thing to mention is the choice of colours.  There is a useful resource<strong>here</strong>(https://www.solidbackgrounds.com/) that provides single-colour images that can be used for creating the frame borders.<br/><br/><br/>And for those of you who are curious where I got the song from,<br/><div class="spoiler_container"><div class="spoiler_header" onclick="hideSecond (this);" role="button">Here you go</div><div class="spoiler_body">https://www.youtube.com/watch?v=34CZjsEI1yU</div></div><br/><br/><br/>That's it for today.<br/><br/><div class="spoiler_container"><div class="spoiler_header" onclick="hideSecond (this);" role="button">Happy thanksgiving to all of you!</div><div class="spoiler_body">(https://i0.wp.com/Laughshop.com/wp-content/uploads/2016/11/This-Planet-Has-Issues-Bert.jpg?fit=478%2C523)</div></div><br/><br/>-- Al<br/>