Share your HTML & CSS layout

Show your personal arts, videos or anything that you've created in this forum.

Moderators: RukiaKuchiki, tsundere

User avatar
Glutton
Posts: 23
Joined: 20 Oct 2015, 17:18

Re: Share your HTML & CSS layout

Post by Glutton » 05 Apr 2016, 17:31

Venerable wrote:
Glutton wrote:
Image
SLAY IT GIRL! <3

lol Ima straight real, you were my motivation XD, at first I was all like well f uck it this won't work, time to play some games. Now that I'm getting the hang of it, I'm producing more than over. ;-; I love you

User avatar
MovieLover
Anispace Cadet
Anispace Cadet
Posts: 92
Joined: 25 Mar 2015, 06:59

Re: Share your HTML & CSS layout

Post by MovieLover » 11 Apr 2016, 03:16

Glutton wrote:Trying out Various things. Out of all the codes I made, this was the most successful hahaha
Image
Beautiful code! Great job! c:
If it was for share, I would love to have it, but I still love it a lot. ^^
Image

Image

Image

User avatar
Glutton
Posts: 23
Joined: 20 Oct 2015, 17:18

Re: Share your HTML & CSS layout

Post by Glutton » 11 Apr 2016, 03:56

MovieLover wrote:
Glutton wrote:Trying out Various things. Out of all the codes I made, this was the most successful hahaha
Image
Beautiful code! Great job! c:
If it was for share, I would love to have it, but I still love it a lot. ^^

I plan to clean up the code a bit so if someone wanted to change it they wouldnt have to go all over the world .all the codes will be up when i get home o3o

User avatar
MovieLover
Anispace Cadet
Anispace Cadet
Posts: 92
Joined: 25 Mar 2015, 06:59

Re: Share your HTML & CSS layout

Post by MovieLover » 12 Apr 2016, 03:09

Glutton wrote:
MovieLover wrote:
Glutton wrote:Trying out Various things. Out of all the codes I made, this was the most successful hahaha
Image
Beautiful code! Great job! c:
If it was for share, I would love to have it, but I still love it a lot. ^^

I plan to clean up the code a bit so if someone wanted to change it they wouldnt have to go all over the world .all the codes will be up when i get home o3o
Alright, I will be looking foward to it. x3
Image

Image

Image

User avatar
xEphemeral
Anispace Apprentice
Anispace Apprentice
Posts: 464
Joined: 05 Apr 2015, 09:10

Re: Share your HTML & CSS layout

Post by xEphemeral » 12 Apr 2016, 03:30

'U DA BAE'-THEME

Preview:
Image
Code:
In bold I marked what you have to edit.
You can edit the theme as much as you like, all I ask for, please keep the credit.
<style type="text/css">

#box_top,#box_ticker,#box_top_ads,#nav{ display: none;}
.Buttons{display: none;}


@font-face { font-family: "silkscreen"; src: url('http://static.tumblr.com/1kdckk4/9yjlolf0w/slkscr.ttf'); }


b, strong {color:#ccc; font-size: 10px; font-family: calibri;}

a img {
opacity: 1.0;
-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;
}

a img:hover{
opacity: 0.7;
-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;
}


textarea {
color: #000;
font-size:10px;
border:1px solid #ccc;
font-family:calibri;
font-size: 11px;
background:#fff;
}

.button {
background:#fff;
border:1px solid #ccc;
padding: 3px 6px;
color: #ccc;
font-size: 10px;
text-transform:uppercase;
font-family:calibri;
text-decoration: none;
text-align: center;
-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;
opacity:1;
}

.button:hover {
cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
text-decoration:line-through;
}

a {
text-transform:uppercase;
font-size:8px;
width:auto;
padding:0px;
font-family:calibri;
color:#ccc;
position:relative;
display:inline-block;
}

a:hover {
cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
text-decoration:none;
color:#ccc;
text-decoration:line-through;
}

body {
cursor: url(http://33.media.tumblr.com/5224536fe0b1 ... s97ld5.png), auto;
font-family:calibri;
font-size:11px;
color:#000;
background-color:#f9f9f9;
background-image:url("http://static.tumblr.com/9u2zteh/rzWm89 ... 261471.jpg");
background-position: fixed;
background-attachment:fixed;
background-repeat:repeat;}


::-webkit-scrollbar {width: 10px; height: 4px; background: #ccc; border-left: 4px solid #fff; border-right: 4px solid #fff; }

::-webkit-scrollbar-thumb { background-color:#ccc; border-left: 2px solid #fff; border-right: 2px solid #fff; }


.musicplayer {
display:block;
overflow:hidden;
width:10px;
height:20px;
background:#transparent;
padding:5px;
position:fixed;
z-index: 9999999;
top:55px;
left:145px;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
-webkit-transition-duration: 0.2s;
transition-duration: 0.2s;
}

.musicplayer img {
position:absolute;
background:#fff;
}

.musicplayer:hover {
width:100px;
}

#sidebar {
position: fixed;
z-index: -1;
left: 50px;
top: 0px;
width: 250px;
padding: 10px;
bottom: 0px;
background-color: #fff;
background-repeat: repeat;
background-attachment: fixed;
z-index: 9999999;
}

#placetwo {
margin-top: 65px;

}

#axel {
position: fixed;
z-index: -1;
left: 95px;
top: 0px;
width: 260px;
padding: 10px;
bottom: 0px;
background-color: #fff;
background-repeat: repeat;
background-attachment: fixed;
z-index: 1000;
}

#lace{
position:fixed;
left: 355px;
bottom: 0px;
width:26px;
padding:0px;
background-image:url('http://i.imgur.com/Wm5ufSA.png');
top:0px;
z-index:999999999;
}

#lace2{
position:fixed;
left: 69px;
bottom: 0px;
width:26px;
padding:0px;
background-image:url('http://i.imgur.com/yYFWdKr.png');
top:0px;
z-index:999999999;
}

#descrip {
background-color: #transparent;
padding: 10px;
font-family: calibri;
font-size: 9px;
text-align: center;
color: #000;
margin-top: 55px;
margin-right: 20px;
}

.portrait {
width: 160px;
height: 160px;
margin-left: -20px;
margin-top: 20px;
border: 1px solid #000;
background-image: url(PICTURE URL HERE);
border-radius:0px 90px 90px 90px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}

.portrait:hover {
border-radius:0px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}

.links {
padding: 5px;
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc;
position:fixed;
top:265px;
width:220px;
text-align: center;
-webkit-transition:opacity 0.8s linear;
-webkit-transition:all 0.5s ease-out;
-moz-transition:all 0.5s ease-out;
transition: all 0.5s ease-out;
z-index: 9999999;
}

.links a {
height:10.8px;
width:auto;
font-family:calibri;
font-size:9px;
text-align:center;
color:#ccc;
padding:0px;
margin-bottom:3px;
text-transform:uppercase;
-webkit-transition:opacity 0.8s linear;
-webkit-transition:all 0.5s ease-out;
-moz-transition:all 0.5s ease-out;
transition: all 0.5s ease-out;
}

.links a:hover {
color:#ccc;
}

.comments {
text-align: center;
box-shadow:rgba(0,0,0,.03) 10px 10px;
border:1px solid #ccc;
outline:1px dashed #ccc;
outline-offset:-5px;
width:550px;
padding:20px;
margin-bottom:20px;
background-color:#fff;
position:relative;
z-index:99999999;
left: 150px;
top: 20px;
font-family: silkscreen;
font-size: 8px;
}
</style>
<body>
<div class="musicplayer">
<img src="http://38.media.tumblr.com/tumblr_m7w2izzY0j1r6o8v2.gif">
Music Code here
</div>

<div id="axel">
<div id="lace"></div>
<div id="lace2"></div>

<div id="placetwo">

<div class="portrait"></div>

<div class="links">
<a href="/">link 1</a>  
<a href="/">link 2</a>  
<a href="/">link 3</a>  
<a href="/">link 4</a> 

<a href="http://www.anispace.net/user/xEphemeral">credit</a>
</div>

<div id="descrip">[ABOUT_ME]</div>

</div>
</div>

<div class="comments">[COMMENT_BOX]</div>

<div style=display:none;>[BUTTONS]</div>
<html>
    
Image

User avatar
MovieLover
Anispace Cadet
Anispace Cadet
Posts: 92
Joined: 25 Mar 2015, 06:59

Re: Share your HTML & CSS layout

Post by MovieLover » 12 Apr 2016, 03:52

xEphemeral wrote:
'U DA BAE'-THEME

Preview:
Image
Code:
In bold I marked what you have to edit.
You can edit the theme as much as you like, all I ask for, please keep the credit.
<style type="text/css">

#box_top,#box_ticker,#box_top_ads,#nav{ display: none;}
.Buttons{display: none;}


@font-face { font-family: "silkscreen"; src: url('http://static.tumblr.com/1kdckk4/9yjlolf0w/slkscr.ttf'); }


b, strong {color:#ccc; font-size: 10px; font-family: calibri;}

a img {
opacity: 1.0;
-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;
}

a img:hover{
opacity: 0.7;
-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;
}


textarea {
color: #000;
font-size:10px;
border:1px solid #ccc;
font-family:calibri;
font-size: 11px;
background:#fff;
}

.button {
background:#fff;
border:1px solid #ccc;
padding: 3px 6px;
color: #ccc;
font-size: 10px;
text-transform:uppercase;
font-family:calibri;
text-decoration: none;
text-align: center;
-webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.7s ease-in-out;-moz-transition: all 0.7s ease-in-out;-o-transition: all 0.7s ease-in-out;
opacity:1;
}

.button:hover {
cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
text-decoration:line-through;
}

a {
text-transform:uppercase;
font-size:8px;
width:auto;
padding:0px;
font-family:calibri;
color:#ccc;
position:relative;
display:inline-block;
}

a:hover {
cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), auto;
text-decoration:none;
color:#ccc;
text-decoration:line-through;
}

body {
cursor: url(http://33.media.tumblr.com/5224536fe0b1 ... s97ld5.png), auto;
font-family:calibri;
font-size:11px;
color:#000;
background-color:#f9f9f9;
background-image:url("http://static.tumblr.com/9u2zteh/rzWm89 ... 261471.jpg");
background-position: fixed;
background-attachment:fixed;
background-repeat:repeat;}


::-webkit-scrollbar {width: 10px; height: 4px; background: #ccc; border-left: 4px solid #fff; border-right: 4px solid #fff; }

::-webkit-scrollbar-thumb { background-color:#ccc; border-left: 2px solid #fff; border-right: 2px solid #fff; }


.musicplayer {
display:block;
overflow:hidden;
width:10px;
height:20px;
background:#transparent;
padding:5px;
position:fixed;
z-index: 9999999;
top:55px;
left:145px;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
-webkit-transition-duration: 0.2s;
transition-duration: 0.2s;
}

.musicplayer img {
position:absolute;
background:#fff;
}

.musicplayer:hover {
width:100px;
}

#sidebar {
position: fixed;
z-index: -1;
left: 50px;
top: 0px;
width: 250px;
padding: 10px;
bottom: 0px;
background-color: #fff;
background-repeat: repeat;
background-attachment: fixed;
z-index: 9999999;
}

#placetwo {
margin-top: 65px;

}

#axel {
position: fixed;
z-index: -1;
left: 95px;
top: 0px;
width: 260px;
padding: 10px;
bottom: 0px;
background-color: #fff;
background-repeat: repeat;
background-attachment: fixed;
z-index: 1000;
}

#lace{
position:fixed;
left: 355px;
bottom: 0px;
width:26px;
padding:0px;
background-image:url('http://i.imgur.com/Wm5ufSA.png');
top:0px;
z-index:999999999;
}

#lace2{
position:fixed;
left: 69px;
bottom: 0px;
width:26px;
padding:0px;
background-image:url('http://i.imgur.com/yYFWdKr.png');
top:0px;
z-index:999999999;
}

#descrip {
background-color: #transparent;
padding: 10px;
font-family: calibri;
font-size: 9px;
text-align: center;
color: #000;
margin-top: 55px;
margin-right: 20px;
}

.portrait {
width: 160px;
height: 160px;
margin-left: -20px;
margin-top: 20px;
border: 1px solid #000;
background-image: url(PICTURE URL HERE);
border-radius:0px 90px 90px 90px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}

.portrait:hover {
border-radius:0px;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}

.links {
padding: 5px;
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc;
position:fixed;
top:265px;
width:220px;
text-align: center;
-webkit-transition:opacity 0.8s linear;
-webkit-transition:all 0.5s ease-out;
-moz-transition:all 0.5s ease-out;
transition: all 0.5s ease-out;
z-index: 9999999;
}

.links a {
height:10.8px;
width:auto;
font-family:calibri;
font-size:9px;
text-align:center;
color:#ccc;
padding:0px;
margin-bottom:3px;
text-transform:uppercase;
-webkit-transition:opacity 0.8s linear;
-webkit-transition:all 0.5s ease-out;
-moz-transition:all 0.5s ease-out;
transition: all 0.5s ease-out;
}

.links a:hover {
color:#ccc;
}

.comments {
text-align: center;
box-shadow:rgba(0,0,0,.03) 10px 10px;
border:1px solid #ccc;
outline:1px dashed #ccc;
outline-offset:-5px;
width:550px;
padding:20px;
margin-bottom:20px;
background-color:#fff;
position:relative;
z-index:99999999;
left: 150px;
top: 20px;
font-family: silkscreen;
font-size: 8px;
}
</style>
<body>
<div class="musicplayer">
<img src="http://38.media.tumblr.com/tumblr_m7w2izzY0j1r6o8v2.gif">
Music Code here
</div>

<div id="axel">
<div id="lace"></div>
<div id="lace2"></div>

<div id="placetwo">

<div class="portrait"></div>

<div class="links">
<a href="/">link 1</a>  
<a href="/">link 2</a>  
<a href="/">link 3</a>  
<a href="/">link 4</a> 

<a href="http://www.anispace.net/user/xEphemeral">credit</a>
</div>

<div id="descrip">[ABOUT_ME]</div>

</div>
</div>

<div class="comments">[COMMENT_BOX]</div>

<div style=display:none;>[BUTTONS]</div>
<html>
Wow, so beautiful! I will use it right away! c:
Image

Image

Image

User avatar
Glutton
Posts: 23
Joined: 20 Oct 2015, 17:18

Re: Share your HTML & CSS layout

Post by Glutton » 16 Apr 2016, 17:48

Ada Wong Theme

Went with a Newsletter type theme.

Image

Image

Image

User avatar
Amaranthe
Anispace Cadet
Anispace Cadet
Posts: 187
Joined: 19 Sep 2015, 12:39

Re: Share your HTML & CSS layout

Post by Amaranthe » 05 May 2016, 19:05

Customized YT code
"Empress"

Image

-Do not redistribute
-Credit: Somewhere at your about me.
-Enjoy
<style>

<style>
#box_top,#box_ticker,#box_bottom,#box_top_ads{display: none;}

.holder{margin:20px;width:500px;overflow-x:hidden;transition:all 0.5s Ease;text-align:left;background-color:transparent;padding:10px;border: 3px double#979797;float:left;background:#000;}
.holder img{max-width:100%;}
.holder2{margin:20px;width:300px;overflow-x:hidden;transition:all 0.5s Ease;text-align:right;background-color:transparent;padding:10px;border: 3px double#979797;float:right;background:#000;}
.holder img{max-width:100%;}

.holder3{margin:20px;width:500px;overflow-x:hidden;transition:all 0.5s Ease;text-align:center;background-color:transparent;padding:10px;border: 3px double#979797;float:center;background:#000;}
.holder img{max-width:100%;}

#nav li a:link, #nav li a:visited {
color:purple;
font-family: verdana;
font-weight:bold;
background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0)));
background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: -o-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: -ms-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 );
text-decoration: none;}

.button {
background:#000;
color:purple;
.button:hover {
background:#D0D0D0;
color:#FFF;
}

</style>
<div style=display:none;">[BUTTONS]</div>


<div class="holder3">
<object width="500" height="280"><param name="movie" value="http://www.youtube.com/nhQQzGVTr3M?auto ... ram><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/nhQQzGVTr3M?autoplay=1" type="application/x-shockwave-flash" width="500" height="280" allowscriptaccess="always" allowfullscreen="true"></embed></object>
</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div class="holder">
<br>[ABOUT_ME]
</div>

<br><br>

<div class=holder2>

<br>[COMMENT_BOX]<br>
</div>
Image

User avatar
XxMayuXx
Anispace Apprentice
Anispace Apprentice
Posts: 276
Joined: 24 Oct 2015, 11:29

Re: Share your HTML & CSS layout

Post by XxMayuXx » 09 May 2016, 16:17

Melli wrote:
{ 3 COLUMNED LAYOUT }

PREVIEW
[spoiler]Image[/spoiler]

CODE
[spoiler][code][DISABLE_NAV_MENU]
<style>
#box_left_ads,#box_top_ads,#box_ticker {display: none;}

#melli{position:fixed; float:right; top:3px; right:0px; width:150px;}

h2{font-family:bell mt;}

.holder{margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:left;float:left;width:275px;padding:5px;margin-left:135;background:#fff;border:1px #E9E9E9 solid;}
.holder img{max-width:100%;}

.holder2{margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:left;width:300px;padding:5px;float:right;background:#fff;border:1px #E9E9E9 solid;font-family:cambria;margin-right:10px}
.holder2 img{max-width:100%;}

.holder3{margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:left;width:300px;padding:5px;float:right;margin-right:;background:#fff;border:1px #E9E9E9 solid;font-family:cambria;}
.holder3 img{max-width:100%;}

</style>
<div style=display:none>[BUTTONS]</div>

<div style=margin-top:50px;>
<div class="holder">
<img src="AVATAR LINK HERE">
<br><br><br>
[MUSIC]
</div>

<div class="holder3">[COMMENT_BOX]</div>

<div class="holder2"><h2>TITLE TEXT HERE</h2></div>
<div class="holder2">[MY_STATS]</div>
<div class="holder2">[ABOUT_ME]</div>


<div id="melli">
<a href="/user/Melli"><img src="http://i.imgur.com/saLvrIo.gif" title="DESIGNED BY MELLI ♥"></a>
</div>[/code][/spoiler]

Code designed by me;
Please do not remove the credit.
You may put the credit wherever you like on your profile
as long as you don't take it off completely.
Love this one I probably gonna use this code
Image
Image
Image
IllyaEmiya wrote:My Bad-Ass Little Sister In The World

User avatar
Amaranthe
Anispace Cadet
Anispace Cadet
Posts: 187
Joined: 19 Sep 2015, 12:39

Re: Share your HTML & CSS layout

Post by Amaranthe » 10 Jun 2016, 14:21

"CUSTOM DEFAULT (Modified) "

Banner Version
[spoiler]Image[/spoiler]

Rules:
-Do not redistribute this code. Anispace use only
-Adjustments are fine as long as you credit me.. or ask me for permission. I worked very hard on this code. Literally one day. Respect the effort all is asked for.
- Do not remove the credit. (You may put it anywhere in your about me. I don't care where as long as its there.

-Banner size width:890px & height:200px

-You can replace the youtube with About me. Add [ABOUT_ME] instead of the youtube code.

Look for this
[spoiler][code]<object width="550" height="350"><param name="movie" value="//www.youtube.com/v/iABwt-B1l1E&?version= ... ram><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="//www.youtube.com/v/iABwt-B1l1E&?version=3&hl=en_US&rel=0" type="application/x-shockwave-flash" width="550" height="338" allowscriptaccess="always" allowfullscreen="true"></embed></object>
[/code][/spoiler]

-Any questions ask me please! I'd love to help you[/color]

[spoiler][DISABLE_NAV_MENU]
<html>
<style>


#box_top,#box_ticker,#box_top_ads,#nav{ display: none;}
.header { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:left;margin-left: 70px;width:890px;height:200px;padding:5px; background: #FFF;border: 1px solid #000; }



.holder { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:left;margin-left: 70px;width:265px;padding:5px;background: #FFF;border: 1px solid #000;font-family: century gothic; }



.sidebar { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:left;width:240px;padding:5px;background: #FFF;border: 1px double #000;font-family: century gothic;-webkit-transition: opacity 0.8s linear;
opacity: 1; }

.sidebar img{max-width:100%;}

.info { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:left;width:240px;height:auto;padding:5px;background: #FFF;border: 1px double #000;font-family: century gothic;-webkit-transition: opacity 0.8s linear;
opacity: 1; }

.holder2 { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:right;padding:5px;width:600px; border: 1px solid #000;font-family: century gothic;background: #FFF;}

textarea {
background: #FFF url(https://45.media.tumblr.com/5f4d9d66c6e ... o3_500.gif) center repeat;
border: 1px solid #000 !important;
font-family: Onyx;
font-size: 18px;
height: 200px !important;
width: 400px !important;
color: #fff;
text-shadow: 0 0 2px #000000, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #FFFFFF, 0 0 10px #000000, 0 0 12px #9862D7, 0 0 14px #000000, 0 0 16px #000000;}
.textarea image{ opacity:opacity: 0.4;}
body {
margin:0px;
background-image: url("URL");
background-attachment: scroll;
background-color: #FFF;/* CHANGE THE BG COLOR */
background-repeat:repeat;

ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color:#333333;
}

li {
float:left;
}

li a {
display: block;
color: purple;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

a:hover:not(.active) {
background-color: gray;
}

.active {
background-color:#333333;
}
a.links {text-shadow: -1px 0px #e42c8b, -2px -1px #e42c8b, 1px 0px #a9e42c, 2px 1px #a9e42c; color: #000;}
</style>

<br><div class=header>
<img src="http://orig15.deviantart.net/6f2e/f/201 ... png"></div>
<div class=holder>
<div class=sidebar><b> </b></font><img src="http://listography.com/user/0945225049/ ... div><br><b>
<br>
<div class=info><ul>
<li><a href="/">HOME</a></li>
<li><a href="">FORUMS</a></li>
<li><a href="http://www.anispace.net/myaccount.php">MY ACCOUNT</a></li>
<li><a href="http://www.anispace.net/rpg.php="#ABOUT">RPG</a></li>
<li><a href="FAVORITE LINK ">FAVORITE ME</a></li>
<li><a href="VOTE ME URL">❤</a></li> <li><a href="ADD LINK">ADD ME</a></li> <li><a href="MESSAGE LINK">✉</a></li> <li><a href="http://www.anispace.net/user/Amaranthe">♛</a></li> </ul>

<hr style="border-top: 1px solid #000"/>
★Welcome to my profile. I enjoy nice conversations with people. I'm not really active these days so don't expect same-day replies. Semi-Hiatus ★
<br></b>

<hr style="border-top: 1px solid #000"/>
<font face="vivaldi" color="gray" size="3px">~I don't know how to be without you anymore.</font>
<br>
</div></div>

<div class=holder2>[MY_STATS]<br></div><div class=holder2><object width="550" height="350"><param name="movie" value="//www.youtube.com/v/iABwt-B1l1E&?version= ... ram><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="//www.youtube.com/v/iABwt-B1l1E&?version=3&hl=en_US&rel=0" type="application/x-shockwave-flash" width="550" height="338" allowscriptaccess="always" allowfullscreen="true"></embed></object></div><div class=holder2>[COMMENT_BOX]<br></div>
<br>
<div style=display:none>[BUTTONS]</div>[/spoiler]

No banner version
[spoiler]Image[/spoiler]

[spoiler][DISABLE_NAV_MENU]
<html>
<style>


#box_top,#box_ticker,#box_top_ads,#nav{ display: none;}
.header { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:left;margin-left: 70px;width:890px;height:200px;padding:5px; background: #FFF;border: 1px solid #000; }



.holder { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:left;margin-left: 70px;width:265px;padding:5px;background: #FFF;border: 1px solid #000;font-family: century gothic; }



.sidebar { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:left;width:240px;padding:5px;background: #FFF;border: 1px double #000;font-family: century gothic;-webkit-transition: opacity 0.8s linear;
opacity: 1; }

.sidebar img{max-width:100%;}

.info { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:left;width:240px;height:auto;padding:5px;background: #FFF;border: 1px double #000;font-family: century gothic;-webkit-transition: opacity 0.8s linear;
opacity: 1; }

.holder2 { margin:5px;overflow:hidden;transition:all 0.5s Ease;text-align:center;float:right;padding:5px;width:550px; border: 1px solid #000;font-family: century gothic;background: #FFF;}

textarea {
background: #FFF url(https://45.media.tumblr.com/5f4d9d66c6e ... o3_500.gif) center repeat;
border: 1px solid #000 !important;
font-family: Onyx;
font-size: 18px;
height: 200px !important;
width: 400px !important;
color: #fff;
text-shadow: 0 0 2px #000000, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #FFFFFF, 0 0 10px #000000, 0 0 12px #9862D7, 0 0 14px #000000, 0 0 16px #000000;}
.textarea image{ opacity:opacity: 0.4;}
body {
margin:0px;
background-image: url("URL");
background-attachment: scroll;
background-color: #FFF;/* CHANGE THE BG COLOR */
background-repeat:repeat;

ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color:#333333;
}

li {
float:left;
}

li a {
display: block;
color: purple;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

a:hover:not(.active) {
background-color: gray;
}

.active {
background-color:#333333;
}
a.links {text-shadow: -1px 0px #e42c8b, -2px -1px #e42c8b, 1px 0px #a9e42c, 2px 1px #a9e42c; color: #000;}
</style>

<br>
<div class=holder>
<div class=sidebar><b> </b></font><img src="http://listography.com/user/0945225049/ ... div><br><b>
<br>
<div class=info><ul>
<li><a href="/">HOME</a></li>
<li><a href="">FORUMS</a></li>
<li><a href="http://www.anispace.net/myaccount.php">MY ACCOUNT</a></li>
<li><a href="http://www.anispace.net/rpg.php="#ABOUT">RPG</a></li>
<li><a href="http://www.anispace.net/friends.php?act ... uid=111500 ">FAVORITE ME</a></li>
<li><a href="VOTE ME URL">❤</a></li> <li><a href="http://www.anispace.net/friends.php?act ... 11500">ADD ME</a></li> <li><a href="ucp.php?i=pm&mode=compose&u=111500">✉</a></li> <li><a href="http://www.anispace.net/user/Amaranthe">♛</a></li> </ul>

<hr style="border-top: 1px solid #000"/>
★Welcome to my profile. I enjoy nice conversations with people. I'm not really active these days so don't expect same-day replies. Semi-Hiatus ★
<br></b>

<hr style="border-top: 1px solid #000"/>
<font face="vivaldi" color="gray" size="3px">~I don't know how to be without you anymore.</font>
<br>
</div></div>

<div class=holder2>[MY_STATS]<br></div><div class=holder2><object width="550" height="350"><param name="movie" value="//www.youtube.com/v/iABwt-B1l1E&?version= ... ram><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="//www.youtube.com/v/iABwt-B1l1E&?version=3&hl=en_US&rel=0" type="application/x-shockwave-flash" width="550" height="338" allowscriptaccess="always" allowfullscreen="true"></embed></object></div><div class=holder2>[COMMENT_BOX]<br></div>
<br>
<div style=display:none>[BUTTONS]</div>[/spoiler]
Image

Post Reply

Who is online

Users browsing this forum: No registered users and 3 guests