Katie's profile picture

Published by


Category: Web, HTML, Tech

Coraline Layout

If you like this style, you can use it in your profile, BUT at least, ADD ME or COMMENT BELOW and give me some kudos! I spent time for making this layout!!!

Credits are appreciated (a post, a bulletin or something else that can support me) 

You have permission to use this for your Layout only, you don't have permission to post elsewhere without giving a link to the original crediting me.


.contact { border-radius: 15px} 

.profile .contact .f-row {
  /* removes extra spacing from contacts */
    margin: 0;

.blog-preview h4,.profile .heading, .profile .contact .heading, .profile .table-section .heading, .home-actions .heading, .profile .blurbs .heading, .profile .friends .heading { border-radius: 15px} 

footer {
        border-radius: 15px;
background-image: url(https://i.pinimg.com/474x/da/18/68/da1868831426d9740b692dcc5c7ffbf9.jpg); 



table, th, td {
  border: 1px solid #1b03a3 ;

table, th, td { border-radius: 15px} 



:root {
        --logo-blue: #1b03a355;
        --darker-blue: ;
        --lighter-blue: h;
        --even-lighter-blue: #1b03a355 ;
        --lightest-blue: #1b03a355 ;
        --dark-orange: purple;
        --light-orange: #1b03a355 ;
        --even-lighter-orange: #1b03a355;
        --green: Aliceblue;

main {
  /* changes made to stuff outside of columns */
    background: transparent;
    padding: 0;
    font-size: 80%;
    color: var(--light-orange);

 .f-col {
    /* allow contacts to stack */
    vertical-align: top;
    margin-bottom: 5px;
    display: block;


        {background: url("https://i.pinimg.com/474x/da/18/68/da1868831426d9740b692dcc5c7ffbf9.jpg")
        no-repeat fixed; background-size: cover;


h1, h2, h3, h4,h5,a, p, nav label, .section {color: white;}


nav:before {
 width: 100%;
 height: 300px;
 display: block;
 content: "";
 background-image: url('https://miro.medium.com/max/3318/0*OkK_CqVmUSVE1p4G.jpg');
 background-position: center center;
 background-size: cover;
@media only screen and (max-width: 600px) {
  height: 200px;

nav {
  overflow-x: hidden;
  position: relative;

nav .top {
  background: transparent;

nav .links {
  background: rgba(0, 0, 0, 0.3);

nav { background-image: url(https://cdn.lowgif.com/small/ebdf2c9b114f83f9-.gif); }

6 Kudos


Displaying 1 of 1 comments ( View all | Add Comment )


xXSp!r!t13Xx's profile picture

I absolutely love this one!!! great work!!

Report Comment

Thank you

by Katie; ; Report