CC#00 Basic Layout

CC#00BNC: Basic Layout ++

CSS

/* Last Update: 04/03/19 */

/* PAGE BACKGROUND AND FONT */
body {
background:#111 url('BACKGROUND URL HERE') fixed;
background-size:cover;
font-family:serif;
}

/* MAIN DISPLAY COLORS */
#profile {
background:#000 url('');
border:1px solid #888;
color:#888;
}
h2, h3 {
border-bottom:1px solid #888;
}

/* CSS MEAT */
#profile {
position:relative;
left:50%;
width:530px;
max-width:95%;
padding:16px;
margin:5px 0;
border-radius:5px;
text-align:center;
transform:translateX(-50%);
-o-transform:translateX(-50%);
-moz-transform:translateX(-50%);
-webkit-transform:translateX(-50%);
}
h2, h3 {
margin:4% 5% 2.5% 5%;
}
img {
min-width:50%;
max-width:85%;
}
#credit {
text-decoration:none;
padding:0 4px;
background-color:#800;
color:#ddd;
border-radius:5px;
}

HTML

<div id="profile">
<img src="IMAGE URL HERE" alt=""/>

<h2>Stats</h2>
<p>
<b>Name:</b> Stat here
<br/><b>Species:</b> Stat here
<br/><b>Age:</b> Stat here
<br/><b>Hair:</b> Stat here
<br/><b>Eyes:</b> Stat here
<br/><b>Height:</b> Stat here
<br/><b>Weight:</b> Stat here
<br/><b>Build:</b> Stat here
<br/><b>Orientation:</b> Stat here
</p>

<h2>About</h2>
<p>
Stuff goes here.
</p>

<h2>OOC</h2>
<li>Old RPC layout available from <a href="http://wix.cera-nore.com/" target="_blank" id="credit" title="CC#00">Mirza</a>
<li>Another bullet</li>
</div>

CC#00BNC: Basic Layout ++

CSS

HTML

Alternates

Basic Layout Split

Basic Layout Buttons