What's new

Resource ⋆we got that power ✦ my freebies 2.0⋆

pasta

sehun

we got that
POWER.
Mmm, my hiatus from codes has ended... For the most part. I won't be constantly posting codes like I did before maybe I will... depends on how bored I am. I made a coding thread because my last one was old and had my early days of coding, which were pretty ugly. I see them and I think of how stupid I was. Now, will I make a request shop? Probably not. I did that once before and I ended up getting incredibly pissed and stressed. Long story short, I hated it. You can edit these codes as much as you want just make sure to leave the credit. Thanks thanks~ Feel free to ask questions if you need help.
links: old coding thread & div tutorials
 
Last edited:

pasta

sehun
NOT MOBILE FRIENDY
hover over images besides the top img. Scroll down for more info.







Oh 'Sehun'//

male
23

sexuality
23
south korean




Quote//


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
2/2/18​




Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
2/3/18​



code by @pasta

[div=width:380px;height:438px;border: 1px solid #cccccc;margin:auto;center;background:white;][div=width:380px;height:438px;margin:auto;center;overflow:hidden;line-height:12px;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][div=width:300px;margin:auto;center;]


[div=height:80px;width:285px;margin:auto;center;background:url('https://78.media.tumblr.com/5a426709006966425accde771a8eaaa3/tumblr_p1bg0dmNCN1wjl0yoo6_1280.png');background-size:100%;]



[right][font=Times New Roman][color=#DFB6AC][size=25px]Oh [i]'Sehun'[/i][color=transparent]//[/color][/size][/color][/font][/right][/div]

[row][column=span4][div=margin:auto;center;width:130px;height:130px;background:url('https://78.media.tumblr.com/a4a8bac0cd4188f4bebef3a5b110db40/tumblr_p3i6bjw12D1r2f14do1_250.png');background-size:100%;][class=x]
background:transparent;
padding: 7px;
Height: 130px;
Width: 130px;
transition-duration: 0.5s;
z-index:-1;
color:transparent;[/class][class name=x state=hover]
background-color: rgb(234,198,191);
opacity:0.8;
color:gray;
width:116px;
height:130px;
[/class][nobr][div class=x][div=position:relative;top:45px;]
[center][font=Times New Roman][size=13px]male[/size][/font][/center][/div][/div][/nobr][/div][/column][column=span4][div=margin:auto;center;width:130px;height:130px;background:url('https://78.media.tumblr.com/26240614da34582ffd3159a86b64d6f2/tumblr_p3i6bjw12D1r2f14do3_250.png');background-size:100%;][class=x]
background:transparent;
padding: 7px;
Height: 130px;
Width: 130px;
transition-duration: 0.5s;
z-index:-1;
color:transparent;[/class][class name=x state=hover]
background-color: rgb(234,198,191);
opacity:0.8;
color:gray;
width:116px;
height:130px;
[/class][nobr][div class=x][div=position:relative;top:45px;]
[center][font=Times New Roman][size=13px]23[/size][/font][/center][/div][/div][/nobr][/div][/column][/row]

[row][column=span4][div=margin:auto;center;width:130px;height:130px;background:url('https://78.media.tumblr.com/fd0be25517418df258624d00ebbd7e94/tumblr_p3i6bjw12D1r2f14do2_250.png');background-size:100%;][class=x]
background:transparent;
padding: 7px;
Height: 130px;
Width: 130px;
transition-duration: 0.5s;
z-index:-1;
color:transparent;[/class][class name=x state=hover]
background-color: rgb(234,198,191);
opacity:0.8;
color:gray;
width:116px;
height:130px;
[/class][nobr][div class=x][div=position:relative;top:45px;]
[center][font=Times New Roman][size=13px]sexuality[/size][/font][/center][/div][/div][/nobr]23[/div][/column][column=span4][div=margin:auto;center;width:130px;height:130px;background:url('https://78.media.tumblr.com/1ecb2df3788da29d8eba9b93e6ca42b3/tumblr_p3i6bjw12D1r2f14do5_250.png');background-size:100%;][class=x]
background:transparent;
padding: 7px;
Height: 130px;
Width: 130px;
transition-duration: 0.5s;
z-index:-1;
color:transparent;[/class][class name=x state=hover]
background-color: rgb(234,198,191);
opacity:0.8;
color:gray;
width:116px;
height:130px;
[/class][nobr][div class=x][div=position:relative;top:45px;]
[center][font=Times New Roman][size=13px]south korean[/size][/font][/center][/div][/div][/nobr][/div][/column][/row]




[size=25px][font=Times New Roman][color=#DFB6AC][right][i]Quote[/i][color=transparent]//[/color][/right][/color][/font][/size]

[div=height:150px;background:#F4EFEC;margin:auto;]
[div=height:120px;center;overflow:hidden;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][font=Karla][color=#DFB6AC][center][size=12px]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
[/size][/center][/color][/font][/div][/div][/div][div=height:0px;position:relative;top:-170px;][div=height:20px;width:90px;background:#E7D6D1;border:0px;border-top-right-radius:30px;border-top-left-radius:30px;][div=position:relative;top:5px;][font=Fjalla One][size=15px][color=#F4EFEC][center]2/2/18[/center][/color][/size][/font][/div][/div][/div]



[div=height:150px;background:#F4EFEC;margin:auto;]
[div=height:120px;center;overflow:hidden;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][font=Karla][color=#DFB6AC][center][size=12px]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
[/size][/center][/color][/font][/div][/div][/div][div=height:0px;position:relative;top:-170px;left:210px;][div=height:20px;width:90px;background:#E7D6D1;border:0px;border-top-right-radius:30px;border-top-left-radius:30px;][div=position:relative;top:5px;][font=Fjalla One][size=15px][color=#F4EFEC][center]2/3/18[/center][/color][/size][/font][/div][/div][/div]



[/div][/div][/div][/div][center][size=1]code by [USER=27673]@pasta[/USER][/size][/center]
 
Last edited:

clout

AHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH
 

pasta

sehun
NOT MOBILE FRIENDY
an ic post for a 1x1 i'm in w/ a friend. instead of replying to the rp, i just made a new code for it.




sor·cer·er


/ˈsôrs(ə)rər/

noun
a person who claims or is believed to have magic powers; a wizard.​
Mi Ji Ho
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.


code by @pasta

[div=width:500px;margin:auto;center;border:1px solid #cccccc;height:480px;background-color:white;]

[div=width:200px;height:150px;background:#cccccc;background-size:100%;margin:auto;center;font-family:Karla;color:white;line-height:12px;position:relative;left:-105px;]
[size=25px]sor·cer·er[/size]


[size=20px]/ˈsôrs(ə)rər/[/size]

noun
[indent]a person who claims or is believed to have magic powers; a wizard.[/indent]
[/div][div=height:0px;][div=height:150px;width:200px;background:url('https://78.media.tumblr.com/6233e701377a0233b5e705ee5242f213/tumblr_orrma8vrC41vimwv4o1_1280.png');background-size:100%;margin:auto;center;position:relative;top:-150px;left:100px;][/div][/div][size=35px][font=Times New Roman][center][color=#cccccc]Mi Ji Ho[/color][/center][/font][/size]
[div=width:410px;height:200px;margin:auto;center;background:#cccccc;overflow:hidden;color:white;font-size:13px;font-family:Karla;line-height:13px;][div=width: calc(100% + 13px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: center;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
[/div][/div]

[/div][size=1][center]code by [USER=27673]@pasta[/USER][/center][/size]
 
Last edited:

pasta

sehun
NOT MOBILE FRIENDY
a cs for a vampire rp im in.




Basics


here


Looks


here



























scroll​




I've been upside down
I don't wanna be the right way round
Can't find paradise on the ground


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.


code by @pasta


[div=margin:auto;center;background:#fff;width:640px;]
[div=height:177px;width:100px;background:#cccccc;margin:auto;center;position:relative;left:-250px;overflow:hidden;color:#000000;font-size:12px;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][font=Oswald][size=25px][color=white][center]

Basics


[/center][/color][/size][/font][div=background:#fff;line-height:12px;][font=Karla]here
[/font][/div][/div][/div][div=height:177px;width:100px;background:#cccccc;margin:auto;center;position:relative;left:-250px;postion:relative;top:2px;overflow:hidden;color:#000000;font-size:12px;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][font=Oswald][size=25px][color=white][center]

Looks


[/center][/color][/size][/font][div=background:#fff;line-height:12px;][font=Karla]here

[/font][/div][/div][/div][div=height:0px;][div=height:355px;width:250px;background:url('https://78.media.tumblr.com/85b6be2591364d9ea55b9a909ba1d2d8/tumblr_ox7ip4gesr1wx3cmko1_1280.jpg');background-size:150%;position:relative;margin:auto;center;top:-355px;left:-70px;overflow:hidden;color:#000000;font-size:12px;line-height:12px;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;]

























[div=text-shadow:2px 1px #000000;color:white;][font=Karla][size=14px][center]scroll[/center][/size][/font][/div]



[div=background:#fff;height:355px;][font=Karla][size=20px]
I've been upside down
I don't wanna be the right way round
Can't find paradise on the ground[/size]

[/font][/div][/div][/div][/div][div=height:0px;][div=height:355px;width:250px;margin:auto;center;position:relative;top:-355px;left:185px;background:#fff;overflow:hidden;color:#000000;font-size:13px;line-height:12px;][div=width: calc(100% + 13px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][font=Karla]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.

[row][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/04daaf934560e07ff6e0cc8bf3f10320/tumblr_orz3eql6Za1vgoaqio2_250.png');background-size:100%;][/div][/column][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/ac98d8611d2d93de1086ce704b05b84a/tumblr_orz3eql6Za1vgoaqio5_250.png');background-size:100%;position:relative;left:-11px;][/div][/column][column=span2][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/2e81b08eb7c43f0dc8fc501c127bcbf0/tumblr_ogusb6V68H1skjimxo2_400.png');background-size:100%;position:relative;left:-21px;][/div][/column][/row][div=position:relative;top:2px;][row][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/882a1b711e549ec967ddefd5dceee1b8/tumblr_oome62CCL21ug8cf7o8_250.png');background-size:100%;][/div][/column][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/7fee4e7739634b1c016cdedbf30ce394/tumblr_oohn7qAbWe1vb84x0o6_250.png');background-size:100%;position:relative;left:-11px;][/div][/column][column=span2][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/7ebfb9c9a3d153edbfb83ba7cf02793b/tumblr_oohn7qAbWe1vb84x0o4_250.png');background-size:100%;position:relative;left:-21px;][/div][/column][/row][/div][div=position:relative;top:4px;][row][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/30fd2863a39b7d747512b5ba6f7120df/tumblr_p3cj7hwvDw1wc73awo8_250.png');background-size:100%;][/div][/column][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/9df54d81e97087d78bc88f21a2995fd6/tumblr_p0xa4cEzZq1wiujh5o1_400.png');background-size:100%;position:relative;left:-11px;][/div][/column][column=span2][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/0a12dc6c548441ce8d718f78586d548f/tumblr_p0xa4cEzZq1wiujh5o2_400.png');background-size:100%;position:relative;left:-21px;][/div][/column][/row][div=position:relative;top:2px;][row][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/07635752d2d870720a3baf2b136a1f3e/tumblr_p1qh34hPVI1ug8cf7o6_r1_250.png');background-size:100%;][/div][/column][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/29d99fd81658b6a2e62bd62fc398d63d/tumblr_p2khmv73Hm1wc73awo6_r1_250.png');background-size:100%;position:relative;left:-11px;][/div][/column][column=span2][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/c66304061d9721cb1807ef35b9f3bfc0/tumblr_oxiaxijQXW1wrikq8o1_400.png');background-size:100%;position:relative;left:-21px;][/div][/column][/row][div=position:relative;top:3px;][row][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/78f44b0456a404ba1d33e7187f49fddf/tumblr_oz0ousNTHv1wg0pvno4_250.png');background-size:100%;][/div][/column][column=span3][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/07dbc9d558eea5eade611e5e38e9c5db/tumblr_oz0ousNTHv1wg0pvno9_250.png');background-size:100%;position:relative;left:-11px;][/div][/column][column=span2][div=height:80px;width:80px;background:url('https://78.media.tumblr.com/d2c23cdb776c2fc0b7d9ed1afca2a6df/tumblr_p08ze9JSzY1wiujh5o7_400.png');background-size:100%;position:relative;left:-21px;][/div][/column][/row][/div][/div][/div][/font][div=position:relative;top:4px;][div=position:relative;top:4px;]
[/div][/div][/div][/div][/div][center][size=1][color=#000000]code by [USER=27673]@pasta[/USER][/color][/size][/center][/div]
 
Last edited:

pasta

sehun
NOT MOBILE FRIENDY
warning: first img is adjusted so it only shows bobby's eyes!!!! press play button for music.

can't do it alone
- name name
location - somewhere
mood - something
tags - people
Said you'd always be my white blood


Circulate the right love
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuerecubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
code by @pasta

[div=margin:auto;center;width:400px;background:white;][div=width:400px;height:80px;background:url('https://78.media.tumblr.com/5549362db4f0bb983003e71370b27ddf/tumblr_ovv16ttB4h1s3wt63o6_400.png');background:size:100%;background-position:0px -500px;margin:auto;center;text-shadow:2px 1px black;font-size:45px;][font=Times New][COLOR=white]can't do it alone[/COLOR][/font][/div][div=height:20px;][left][color=#666][font=Lato][fa]fa-play[/fa] - name name[/font][/color][font=Lato][/font][/left][div=opacity: 0;margin-top:-35px;margin-left:-8px;][media=soundcloud]https://soundcloud.com/ohwondermusic/white-blood[/media][/div][/div]
[div=height:120px;width:120px;line-height:12px;][color=gray][size=12px][font=Alegreya Sans SC]location - somewhere
mood - something
tags - people[/font][/size][/color][/div][div=height:0px;margin:auto;center;position:relative;top:-120px;left:65px;][div=height:120px;width:270px;background:url('https://i2.wp.com/68.media.tumblr.com/8843f2a4b9185be97d5e2c810ad1e763/tumblr_ow4epm6ZKu1r0p67co4_1280.gif?w=605');background-size:100%;margin:auto;center;text-shadow:2px 1px black;font-size:18px;line-height:29px;][font=Times New][COLOR=white]Said you'd always be my white blood


Circulate the right love[/COLOR][/font][/div][/div][div=height:120px;width:400px;margin:auto;center;overflow:hidden;color:gray;font-size:12px;line-height:12px;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][font=Alegreya Sans SC]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuerecubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
[/font][/div][/div][center][size=1][color=black]code by [USER=27673]@pasta[/USER][/color][/size][/center][/div]
 

pasta

sehun
NOT MOBILE FRIENDY
looooooks way better on the light theme. i don't feel like fixing it for the dark theme :[ i used the tabs from the bbcode+ thread as a base and then made that mess. ok it's my first try at these tabs >:[ im trying to make them look nice. i swear i'll get better!!!! lowkey should've added more detail. save me

1
2
Kim Hansol
code by @pasta

[nobr]
[class=tabs]
background-color: white;
box-sizing: border-box;
color: black;
font-size: 12px;
font-weight: bold;
line-height: 1;
margin: 20px auto;
position:relative;
left: -110px;
top:0px;
text-align: center;
width:30px;
[/class]

[class=tab]
box-sizing: border-box;
cursor: cell;
display: inline-block;
padding: 10px 0;
width: 30px;
[/class]

[class name=tab state=hover]
background-color: #cccccc;
color:white;
[/class]

[script class=tab on=click]
hide tabsContent
set currentTab (getText)
if (eq ${currentTab} 1) (show tabsContentOne)
if (eq ${currentTab} 2) (show tabsContentTwo)
[/script]
[div class=tabs][div class=tab style="color:black;width:30px;top:0px;position:relative;left:0px;"][size=12px][font=Times New Roman]1[/font][/size][/div][div class=tab][color=black][size=12px][font=Times New Roman]2[/font][/size][/color][/div][/div]

[div class="tabsContent tabsContentOne"][div=height:320px;position:relative;margin-left:500px;margin-top:-100px;][div=width:250px;height:45px;background:#cccccc;font-size:30px;color:white;][font=Lato][i]Kim Hansol[/i][/font][/div]

[div=border:1px solid #cccccc;height:250px;width:250px;margin:auto;position:relative;left:-207px;top:10px;][div=height:230px;width:230px;background:url('https://78.media.tumblr.com/17589d1f3bd9b957bed69ab121f44e5e/tumblr_p08g5qoJka1wpxit8o1_500.jpg');background-size:110%;margin:auto;border:10px solid #fff;][/div][/div]
[/div][/div]

[div class="tabsContent tabsContentTwo" style="display: none;"][div=height:320px;position:relative;margin-left:500px;margin-top:-100px;][div=width:250px;height:45px;background:#cccccc;font-size:30px;color:white;][font=Lato][i]About[/i][/font][/div][div=border:1px solid #cccccc;height:250px;width:250px;margin:auto;position:relative;left:-207px;top:10px;][div=height:230px;width:230px;margin:auto;border:10px solid #fff;overflow:hidden;color:gray;font-size:12px;line-height:12px;background:white;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][font=Alegreya Sans SC]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuerecubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
[/font][/div][/div][/div][/div][/div][/nobr][div=height:10px;position:relative;top:-10px;left:40px;][center][size=1]code by [USER=27673]@pasta[/USER][/size][/center][/div]
 

Fyuri

積ん読
Administrator
Supporter
NOT MOBILE FRIENDY
looooooks way better on the light theme. i don't feel like fixing it for the dark theme :[ i used the tabs from the bbcode+ thread as a base and then made that mess. ok it's my first try at these tabs >:[ im trying to make them look nice. i swear i'll get better!!!! lowkey should've added more detail. save me

1
2
Kim Hansol
code by @pasta

[nobr]
[class=tabs]
background-color: white;
box-sizing: border-box;
color: black;
font-size: 12px;
font-weight: bold;
line-height: 1;
margin: 20px auto;
position:relative;
left: -110px;
top:0px;
text-align: center;
width:30px;
[/class]

[class=tab]
box-sizing: border-box;
cursor: cell;
display: inline-block;
padding: 10px 0;
width: 30px;
[/class]

[class name=tab state=hover]
background-color: #cccccc;
color:white;
[/class]

[script class=tab on=click]
hide tabsContent
set currentTab (getText)
if (eq ${currentTab} 1) (show tabsContentOne)
if (eq ${currentTab} 2) (show tabsContentTwo)
[/script]
[div class=tabs][div class=tab style="color:black;width:30px;top:0px;position:relative;left:0px;"][size=12px][font=Times New Roman]1[/font][/size][/div][div class=tab][color=black][size=12px][font=Times New Roman]2[/font][/size][/color][/div][/div]

[div class="tabsContent tabsContentOne"][div=height:320px;position:relative;margin-left:500px;margin-top:-100px;][div=width:250px;height:45px;background:#cccccc;font-size:30px;color:white;][font=Lato][i]Kim Hansol[/i][/font][/div]

[div=border:1px solid #cccccc;height:250px;width:250px;margin:auto;position:relative;left:-207px;top:10px;][div=height:230px;width:230px;background:url('https://78.media.tumblr.com/17589d1f3bd9b957bed69ab121f44e5e/tumblr_p08g5qoJka1wpxit8o1_500.jpg');background-size:110%;margin:auto;border:10px solid #fff;][/div][/div]
[/div][/div]

[div class="tabsContent tabsContentTwo" style="display: none;"][div=height:320px;position:relative;margin-left:500px;margin-top:-100px;][div=width:250px;height:45px;background:#cccccc;font-size:30px;color:white;][font=Lato][i]About[/i][/font][/div][div=border:1px solid #cccccc;height:250px;width:250px;margin:auto;position:relative;left:-207px;top:10px;][div=height:230px;width:230px;margin:auto;border:10px solid #fff;overflow:hidden;color:gray;font-size:12px;line-height:12px;background:white;][div=width: calc(100% + 17px); height: calc(100% + 17px); overflow: scroll; box-sizing: border-box; text-align: justify;][font=Alegreya Sans SC]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin viverra tortor purus, id hendrerit enim dictum at. Nunc scelerisque eros mauris, ac tincidunt sem euismod at. Sed mollis sollicitudin enim, ut sollicitudin urna mollis et. Duis a risus quam. Mauris ultricies vehicula erat, eu tempus risus iaculis vitae. Fusce id eros in eros dapibus finibus. Sed vel imperdiet velit, ac auctor eros. Suspendisse potenti. Curabitur dapibus metus et tellus accumsan feugiat. Donec est velit, porttitor vitae dignissim at, sollicitudin ac diam. Pellentesque condimentum augue eu magna facilisis, a ultricies felis ornare. Phasellus sit amet neque nisl. Maecenas fringilla, lorem et pharetra efficitur, justo urna consectetur erat, et porta dui libero vel tortor. Praesent vehicula, ipsum euismod consequat aliquet, sapien purus dapibus urna, sit amet tempus libero arcu eu quam. Aliquam nec turpis nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuerecubilia Curae; Nunc porta mauris ex, non venenatis augue porta eu. Aliquam nibh sem, gravida non nulla nec, lacinia volutpat magna. Mauris semper massa eu turpis pulvinar semper.
[/font][/div][/div][/div][/div][/div][/nobr][div=height:10px;position:relative;top:-10px;left:40px;][center][size=1]code by [USER=27673]@pasta[/USER][/size][/center][/div]
This is completely static for me...
 

pasta

sehun
This is completely static for me...
Hm, I don't know why that would be. Maybe because I used relative instead of absolute, or I didn't only use classes or different browsers. I didn't change much of the base code besides moving it around. Even on mobile it looks somewhat ok for me.
 

Fyuri

積ん読
Administrator
Supporter
Hm, I don't know why that would be. Maybe because I used relative instead of absolute, or I didn't only use classes or different browsers. I didn't change much of the base code besides moving it around. Even on mobile it looks somewhat ok for me.
Yeah, the tabs don't work and I tried it on FF and Chrome. X3 It's just completely static.
pastanowork.png
 

Lyro

Errant Chronicler
Moderator
Lord of the BBCode
The "Kim Hansol" part covers up the tabs when the page gets to a certain width, preventing interaction.
 

Fyuri

積ん読
Administrator
Supporter
Ah, my screen is actually quite large so thay may be the problem. I use chrome so it's probably not different browsers.
Yeah, the resolution works on mobile to show the tabs. How large is your resolution exactly? Mine is actually fairly standard, so it's odd that on a smaller resolution it works, but larger.. it doesn't X3
 

pasta

sehun
Yeah, the resolution works on mobile to show the tabs. How large is your resolution exactly? Mine is actually fairly standard, so it's odd that on a smaller resolution it works, but larger.. it doesn't X3
I don't exactly know. My screen, in my opinion, is wide for an average laptop. I think it is, compared to the laptops I've had before. But, it works for some screens and not for others.
 
Last edited:

Users Who Are Viewing This Thread (Users: 0, Guests: 1)

Top