[20] Holy Muselists, Batman!

[lina_trinch]

Details List Version

bruce wayne
batman

★★★✰✰
username

information

biography

open post

navigation

games

mask or menace

prismatica

deerington

Code:
<center> <!---Just have ONE center tag at the top of your entry's code. For any other blocks you use in the same entry, delete the center tag in those.---> <div style="display:inline-block;background: #fff;box-shadow: 0px 0px 5px;width: 300px;text-align:center;font-family:helvetica;font-variant:small-caps;font-weight:bold;padding-bottom: 8px;margin: 0 10px 20px 0;"> <div style="height: 150px;background: url(IMG);background-position:center;background-size:cover;"> <div style="color: #fff;font-family:helvetica;text-align:center;font-weight:bold;font-variant:small-caps;text-shadow: 2px 2px #000;font-size: 23px;letter-spacing: 5px;padding-top: 45px;"> character <br /><font style="font-size: 16px;letter-spacing: 10px;"> canon </font> </div> </div> <div style="height:4px; background: linear-gradient(180deg, rgba(0,0,0,0.5), rgba(0,0,0,0));"></div> <font style="letter-spacing: 8px;"> ★★★✰✰ </font><br /> <a href="URL" style="color:#000;text-decoration:none;letter-spacing: 5px;">username</a> <details style="border: 1px solid #999;width: 95%;margin: 5px 0 0 7px;background: rgba(0,0,0,0.1);"> <summary style="outline:none;cursor:pointer;margin: 5px;">information</summary> <a href="URL" style="color:#000;text-decoration:none;font-weight:normal;"><div style="background: rgba(0,0,0,0.1);margin: 5px;border: 1px solid #999;">link</div></a> <a href="URL" style="color:#000;text-decoration:none;font-weight:normal;"><div style="background: rgba(0,0,0,0.1);margin: 5px;border: 1px solid #999;">link</div></a> <a href="URL" style="color:#000;text-decoration:none;font-weight:normal;"><div style="background: rgba(0,0,0,0.1);margin: 5px;border: 1px solid #999;">link</div></a> <details style="margin-bottom: 5px;"> <summary style="cursor:pointer;outline:none;"> games</summary> <a href="URL" style="color:#000;text-decoration:none;font-weight:normal;"><div style="background: rgba(0,0,0,0.1);margin: 5px;border: 1px solid #999;">link</div></a> <a href="URL" style="color:#000;text-decoration:none;font-weight:normal;"><div style="background: rgba(0,0,0,0.1);margin: 5px;border: 1px solid #999;">link</div></a> <a href="URL" style="color:#000;text-decoration:none;font-weight:normal;"><div style="background: rgba(0,0,0,0.1);margin: 5px;border: 1px solid #999;">link</div></a> </details> </details> </div> <!--DONT REMOVE--> <br /><a href="https://killthecake.dreamwidth.org/" style="text-decoration:none;color: #555;font-family:helvetica;font-variant:small-caps;font-size:10px;">killthecake</a>





Details Icons Version

bruce wayne
batman

★★★✰✰
username

Mask or Menace

Prismatica

Deerington

Code:
<center> <!---Just have ONE center tag at the top of your entry's code. For any other blocks you use in the same entry, delete the center tag in those.---> <div style="display:inline-block;background: #fff;box-shadow: 0px 0px 5px;width: 300px;text-align:center;font-family:helvetica;font-variant:small-caps;font-weight:bold;padding-bottom: 4px;margin: 0 10px 20px 0;"> <div style="height: 150px;background: url(IMG);background-position:center;background-size:cover;"> <div style="color: #fff;font-family:helvetica;text-align:center;font-weight:bold;font-variant:small-caps;text-shadow: 2px 2px #000;font-size: 23px;letter-spacing: 5px;padding-top: 45px;"> character <br /><font style="font-size: 16px;letter-spacing: 10px;"> canon </font> </div> </div> <div style="height:4px; background: linear-gradient(180deg, rgba(0,0,0,0.5), rgba(0,0,0,0));"></div> <font style="letter-spacing: 8px;"> ★★★✰✰ </font><br /> <a href="URL" style="color:#000;text-decoration:none;letter-spacing: 5px;">username</a> <br /> <a href="" style="margin-right: 25px;"><img src="https://img.icons8.com/material-outlined/24/000000/info.png"/></a> <a href="" style="margin-right: 25px;"><img src="https://img.icons8.com/material-outlined/24/000000/comments.png"/></a> <a href=""><img src="https://img.icons8.com/material-outlined/24/000000/search-in-list.png"/></a> <details style="font-weight:normal;letter-spacing: 2px;"> <summary style="outline:none;cursor:pointer;text-align:right;color:transparent;margin-right: 5px;"> <img src="https://img.icons8.com/material-outlined/24/000000/move-down.png"/> </summary> <center> <a href="URL" style="text-decoration:none;color: #fff;"><div style="background: url(GAME_IMG);height: 20px;background-position:center;margin: 5px;margin-top: 0;"> <div style="background: rgba(0,0,0,0.3);padding: 1px 0;text-shadow: 1px 1px #666;"> game </div> </div></a> <a href="URL" style="text-decoration:none;color: #fff;"><div style="background: url(GAME_IMG);height: 20px;background-position:center;margin: 5px;margin-top: 0;"> <div style="background: rgba(0,0,0,0.3);padding: 1px 0;text-shadow: 1px 1px #666;"> game </div> </div></a> <a href="URL" style="text-decoration:none;color: #fff;"><div style="background: url(GAME_IMG);height: 20px;background-position:center;margin: 5px;margin-top: 0;"> <div style="background: rgba(0,0,0,0.3);padding: 1px 0;text-shadow: 1px 1px #666;"> game </div> </div></a> </center> </details> </div> <!--DONT REMOVE--> <br /><a href="https://killthecake.dreamwidth.org/" style="text-decoration:none;color: #555;font-family:helvetica;font-variant:small-caps;font-size:10px;">killthecake</a>





Icons Version

bruce wayne
batman

★★★✰✰
username

Code:
<center> <!---Just have ONE center tag at the top of your entry's code. For any other blocks you use in the same entry, delete the center tag in those.---> <div style="display:inline-block;background: #fff;box-shadow: 0px 0px 5px;width: 300px;text-align:center;font-family:helvetica;font-variant:small-caps;font-weight:bold;padding-bottom: 4px;margin: 0 10px 20px 0;"> <div style="height: 150px;background: url(IMG);background-position:center;background-size:cover;"> <div style="color: #fff;font-family:helvetica;text-align:center;font-weight:bold;font-variant:small-caps;text-shadow: 2px 2px #000;font-size: 23px;letter-spacing: 5px;padding-top: 45px;"> character <br /><font style="font-size: 16px;letter-spacing: 10px;"> canon </font> </div> </div> <div style="height:4px; background: linear-gradient(180deg, rgba(0,0,0,0.5), rgba(0,0,0,0));"></div> <font style="letter-spacing: 8px;"> ★★★✰✰ </font><br /> <a href="URL" style="color:#000;text-decoration:none;letter-spacing: 5px;">username</a> <br /> <a href="BIO_URL" style="margin-right: 25px;"><img src="https://img.icons8.com/material-outlined/24/000000/info.png"/></a> <a href="OPEN_URL" style="margin-right: 25px;"><img src="https://img.icons8.com/material-outlined/24/000000/comments.png"/></a> <a href="NAV_URL"><img src="https://img.icons8.com/material-outlined/24/000000/search-in-list.png"/></a> <br /> <center> <div style="letter-spacing: 25px;"> <a href="URL"><div style="display:inline-block;width: 24px; height: 24px;border-radius: 50px;background: url(GAME_IMG);background-position:center;background-size:cover;"></div></a> <a href="URL"><div style="display:inline-block;width: 24px; height: 24px;border-radius: 50px;background: url(GAME_IMG);background-position:center;background-size:cover;"></div></a> <a href="URL"><div style="display:inline-block;width: 24px; height: 24px;border-radius: 50px;background: url(GAME_IMG);background-position:center;background-size:cover;"></div></a> </div> </center> </div> <!--DONT REMOVE--> <br /><a href="https://killthecake.dreamwidth.org/" style="text-decoration:none;color: #555;font-family:helvetica;font-variant:small-caps;font-size:10px;">killthecake</a>





Tabs Version

bruce wayne
batman

★★★✰✰
username

Code:
<center> <!---Just have ONE center tag at the top of your entry's code. For any other blocks you use in the same entry, delete the center tag in those.---> <div style="display:inline-block;width:366px;"> <div style="display:inline-block;background: #fff;box-shadow: 0px 0px 5px;width: 300px;text-align:center;font-family:helvetica;font-variant:small-caps;font-weight:bold;padding-bottom: 4px;margin: 0 10px 20px 0;"> <div style="height: 150px;background: url(IMG);background-position:center;background-size:cover;"> <div style="color: #fff;font-family:helvetica;text-align:center;font-weight:bold;font-variant:small-caps;text-shadow: 2px 2px #000;font-size: 23px;letter-spacing: 5px;padding-top: 45px;"> character <br /><font style="font-size: 16px;letter-spacing: 10px;"> canon </font> </div> </div> <div style="height:4px; background: linear-gradient(180deg, rgba(0,0,0,0.5), rgba(0,0,0,0));"></div> <font style="letter-spacing: 8px;"> ★★★✰✰ </font><br /> <a href="URL" style="color:#000;text-decoration:none;letter-spacing: 5px;">username</a> <br /> <a href="BIO_URL" style="margin-right: 25px;"><img src="https://img.icons8.com/material-outlined/24/000000/info.png"/></a> <a href="OPEN_URL" style="margin-right: 25px;"><img src="https://img.icons8.com/material-outlined/24/000000/comments.png"/></a> <a href="NAV_URL"><img src="https://img.icons8.com/material-outlined/24/000000/search-in-list.png"/></a> </div> <div style="display:inline-block;width:40px;height:220px;position:relative;right:14px;top:15px;"> <a href="URL"><div style="background: url(GAME_IMG);background-position:center;background-size:cover;height: 40px;border-radius: 0 50px 50px 0;box-shadow: 0px 0px 5px #000;margin-bottom: 5px;"></div></a> <a href="URL"><div style="background: url(GAME_IMG);background-position:center;background-size:cover;height: 40px;border-radius: 0 50px 50px 0;box-shadow: 0px 0px 5px #000;margin-bottom: 5px;"></div></a> <a href="URL"><div style="background: url(GAME_IMG);background-position:center;background-size:cover;height: 40px;border-radius: 0 50px 50px 0;box-shadow: 0px 0px 5px #000;margin-bottom: 5px;"></div></a> </div> </div> <!--DONT REMOVE--> <br /><a href="https://killthecake.dreamwidth.org/" style="text-decoration:none;color: #555;font-family:helvetica;font-variant:small-caps;font-size:10px;">killthecake</a>





Plain Version

bruce wayne
batman

★★★✰✰
username

Code:
<center> <!---Just have ONE center tag at the top of your entry's code. For any other blocks you use in the same entry, delete the center tag in those.---> <div style="display:inline-block;background: #fff;box-shadow: 0px 0px 5px;width: 300px;text-align:center;font-family:helvetica;font-variant:small-caps;font-weight:bold;padding-bottom: 4px;margin: 0 10px 20px 0;"> <div style="height: 150px;background: url(IMG);background-position:center;background-size:cover;"> <div style="color: #fff;font-family:helvetica;text-align:center;font-weight:bold;font-variant:small-caps;text-shadow: 2px 2px #000;font-size: 23px;letter-spacing: 5px;padding-top: 45px;"> character <br /><font style="font-size: 16px;letter-spacing: 10px;"> canon </font> </div> </div> <div style="height:4px; background: linear-gradient(180deg, rgba(0,0,0,0.5), rgba(0,0,0,0));"></div> <font style="letter-spacing: 8px;"> ★★★✰✰ </font><br /> <a href="URL" style="color:#000;text-decoration:none;letter-spacing: 5px;">username</a> <br /> <a href="BIO_URL" style="margin-right: 25px;"><img src="https://img.icons8.com/material-outlined/24/000000/info.png"/></a> <a href="OPEN_URL" style="margin-right: 25px;"><img src="https://img.icons8.com/material-outlined/24/000000/comments.png"/></a> <a href="NAV_URL"><img src="https://img.icons8.com/material-outlined/24/000000/search-in-list.png"/></a> </div> <!--DONT REMOVE--> <br /><a href="https://killthecake.dreamwidth.org/" style="text-decoration:none;color: #555;font-family:helvetica;font-variant:small-caps;font-size:10px;">killthecake</a>

❖ Make sure Disable Auto-Formatting is checked when you copy/paste the code into your post. ❖ Yes, they can go side by side in a grid sort of pattern. ❖ Each code only has one template in each. You'll have to c/p it as many times as you need. You don't have to c/p the credit every time, though. I mean, unless you want to. Go nuts. ❖ The little icons used here are from icons8. ❖ Please let me know if things break or you have questions. This was a quickly whipped up product brought to you by the quarantine hiimgoingcrazy Ctrl+F & Replace: ❖ IMG - Header image ❖ GAME_IMG - Images for the games ❖ character - name of your character ❖ canon - name of the canon ❖ link - link text ❖ game - name of a game ❖ URL - individual link urls ❖ BIO_URL - link to an info post ❖ OPEN_URL - link to an open post ❖ NAV_URL - link to a navigation post

Comments

[plentyofwords]

I have another quick question. For the details version of the coding block, if you have a character in multiple games, is it possible to have each game tab drop down or no?

[hatejakku]

Hi! Sorry, in an rp account so I can reply to this a little faster. but Yes! Here's a template real quick for you to use for dropdown menus.

<details> <summary>TITLE</summary> LINK LINK LINK </details>

To use it in this, I'd just fit the summary bits around the name of the game, maybe removing the link coding while I'm at it, and then put in the links in the selected parts. Anything above the /details tag will be in the dropdown.

If the box around the game name gets screwy, just take the style="CODING" parts out of the div tags, delete those, and put it in the summary or details tags. I hope that helps!