rotten to the core
Welcome to Rotten to the Core, a Descendants site
© the divine zero



 
Add Reply
New Topic
New Poll

 Application
Xalcen
 Posted: Nov 4 2017, 09:10 PM
Quote
XalcenAdmin
N/A
N/A
N/A
N/A
N/A
195 posts • N/A • N/A


Mirror Mirror, On The Wall
Basic Info
Character Name
First M. Last

Character Age
Age Letters

Character Origin
Fairytale of origin.

Face Claim
Name of claim.
Personality & Appearance
Personality
Text here

Appearance
Text here

History & Powers
Text here

Powers
Text here
The Writer
Name
Alias

Pronouns
He/She/They/Etc

Timezone
answer

Characters I Play
• Character 1
• Character 2
• Character 3
• Character 4
• Character 5
Who's the fairest of them all?
made by Little One of CAUTION



CODE
[dohtml]<center>
<div class="lietome">Mirror Mirror, On The Wall</div>
<div class="mirrormirror">

<div class="iwannasee"><img src="http://placehold.it/230x346" class="ifonlywishes"></div>
<div class="showmewhat"></div>



<div class="ouatcontainer">

<div class="ouattabs">


<div class="ouattab">
<input type="radio" id="ouattab-1" name="ouattab-group-1" checked>
<label for="ouattab-1"> <! Tab One !> </label>
<div class="ouatcontent">

<div class="andallmydreams">Basic Info</div>
<div class="whosthefairest">
<div class="onthewall">Character Name</div>
<div class="couldcometrue">

First M. Last

</div>
<br>

<div class="onthewall">Character Age</div>
<div class="couldcometrue">

Age Letters

</div>
<br>

<div class="onthewall">Character Origin</div>
<div class="couldcometrue">

Fairytale of origin.

</div>
<br>

<div class="onthewall">Face Claim</div>
<div class="couldcometrue">

Name of claim.

</div>



</div>
</div>
</div>


<div class="ouattab">
<input type="radio" id="ouattab-2" name="ouattab-group-1">
<label for="ouattab-2"> <! Tab Two !> </label>
<div class="ouatcontent">

<div class="andallmydreams">Personality & Appearance</div>


<div class="whosthefairest">
<div class="onthewall">Personality</div>
<div class="couldcometrue">

Text here

</div>
<br>

<div class="onthewall">Appearance</div>
<div class="couldcometrue">

Text here

</div>
<br>

</div>
</div>
</div>

<div class="ouattab">
<input type="radio" id="ouattab-3" name="ouattab-group-1">
<label for="ouattab-3"> <! Tab Three !> </label>
<div class="ouatcontent">

<div class="andallmydreams">History & Powers</div>
<div class="whosthefairest">
<div class="couldcometrue">

Text here
</div>

<br>


<div class="onthewall">Powers</div>
<div class="couldcometrue">

Text here


</div>
</div>
</div>
</div>


<div class="ouattab">
<input type="radio" id="ouattab-4" name="ouattab-group-1">
<label for="ouattab-4"> <! Tab Four !> </label>
<div class="ouatcontent">

<div class="andallmydreams">The Writer</div>
<div class="whosthefairest">
<div class="onthewall">Name</div>
<div class="couldcometrue">

Alias

</div>
<br>

<div class="onthewall">Pronouns</div>
<div class="couldcometrue">

He/She/They/Etc

</div>
<br>

<div class="onthewall">Timezone</div>
<div class="couldcometrue">

answer

</div>
<br>

<div class="onthewall">Characters I Play</div>
<div class="couldcometrue">

• Character 1
<br>• Character 2
<br>• Character 3
<br>• Character 4
<br>• Character 5

</div>



</div>
</div>
</div>


</div>
</div>


</div>
<div class="couldbedreams">Who's the fairest of them all?</div>
<link href='https://fonts.googleapis.com/css?family=Dancing+Script' rel='stylesheet' type='text/css'>
<div style="font-size: 10px; text-align: center;">made by <a href="http://cttw.jcink.net/index.php?showuser=2236">Little One</a> of <a href="http://cttw.jcink.net/index.php?">CAUTION</a></div>
</center>

<style>
.ouatcontainer {
margin: 10px auto;
height: auto;
width: auto;
position: relative;
}

.ouattabs {
margin: 0px auto;
position: relative;
width: 300px;
height:  300px;
}

.ouattab {
float: left; /* CHANGE TO DISPLAY:BLOCK FOR VERTICAL TABS */
}

/* position your tab labels in ouat - also use margins to space your labels - you kind of have to eye until it's centered bc the math with tabs gets confusing */
.ouattab label {
display: block; /* this lets you fix the label dimensions */
width: 30px;
height: 30px;
background: url(http://i.imgur.com/x1gPFZL.jpg);
border: 1px solid #9e75b2;
margin: 0px;
position: relative;
left: -100px;
top: 458px;
z-index: 1;
margin-left: 19.4px;
border-radius: 30px;
}

.ouattab input[type=radio]:checked ~ label {
background: #000;
z-index: 2;
border-radius: 30px;
border: 1px #000 solid;
}

.ouattab input[type=radio] {
display: none; /* DON'T EDIT */
}

/* if you want tab transitions they go ouat */
.ouatcontent {
position: absolute;
top: 0px;
bottom: -190px;
left: 160px;
right: -125px;
background: url(http://i.imgur.com/x1gPFZL.jpg);
padding: 10px;
border: 1px solid #000;
overflow: hidden;
}

/* if you want tab transitions they also go ouat */
.ouattab input[type=radio]:checked ~ label ~ .ouatcontent {
z-index: 1;
}

.mirrormirror {
     width: 550px;
  height: 510px;
  position: relative;
  padding-top: 10px;
}

.lietome {
  height: 60px;
  background: #9e75b2;
  width: 550px;
  color: #fff;
  line-height: 60px;
  font-size: 40px;
  font-family: dancing script;
}

.showmewhat {
  background: url(http://i.imgur.com/FBCJfR6.png);
  width: 273px;
  height: 446px;
  position: absolute;
  top: 20px;
  left: 0px;
}

.iwannasee {
  height: 346px;
  width: 230px;
  position: absolute;
  top: 70px;
  left: 22px;
}

.ifonlywishes {
      border-radius: 300px;
}

.couldbedreams {
      height: 60px;
  background: #9e75b2;
  width: 550px;
  color: #fff;
  line-height: 60px;
  font-size: 40px;
  font-family: dancing script;
}

.andallmydreams {
  height: 50px;
  width: 263px;
  font-family: dancing script;
  background: #9e75b2;
margin-left: -10px;
margin-top: 20px;
  color: #fff;
  line-height: 50px;
  font-size: 24px;
  margin-bottom: 10px;
}


.couldcometrue {
  text-align: justify;
  padding: 5px 20px;
  font-family: calibri;
  font-size: 12px;
  line-height: 14px;
color: #000;
}

.onthewall {
  font-family: impact;
  text-align: left;
  font-size: 18px;
  line-height: 18px;
color: #585858;
}

.whosthefairest {
  width: 243px;
  height: 388px;
  position: absolute;
  top: 80px;
  left: 0px;
  padding: 10px;
  overflow: auto;
}
</style>[/dohtml]
PMEmail
^
0 User(s) are reading this topic (0 Guests and 0 Anonymous Users)
0 Members:

Topic Options
Add Reply
New Topic
New Poll


 


 


skinned by josh dun of shine, cc, wecode, and ctw. cfs by black @ code