floating profile page!!

i had the same problem as you, i changed the code of my floaties and made them to the footer and then removed the footer from op's code like so:

footer::after{
bottom: 3%;
left: 77%;
position:fixed;
pointer-events: none;
content:url("https://media.tenor.com/0CxDcUIjV3EAAAAi/karkat-homestuck.gif");
}

footer::before{
content: '';
background-repeat: no-repeat;
height: 500px;
width: 500px;
z-index: 200;
left: 0px;
bottom: 0px;
position:fixed;
pointer-events: none;
background-image: url("https://media.tenor.com/xNuJkUd-VBIAAAAi/homestuck-karkat.gif");
background-size:280px;
background-position: bottom 5% left 5%;
}

so i originally had 2 so i just made one before and the other after because you cant have both in one yknow ? in the footer::before i made it a background image so i could change the size but i didnt need that for the footer::after. you can [[and should]] change the position and size of this if you will use this code see what works best for you this website helped me alot with positioning

also im not a professional coder so idk if this si even the best way to do it but hey it works, heres the edited code from this layout too:

body::before {

}

.col, main, nav::before, .online, nav .links, nav .top {
animation: float 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}

.col, main, nav::before, .online, nav .links, nav .top {
animation: float 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
@keyframes float {
0% { transform: translate(0, 0px);
}
50% {
transform: translate(0, 8px);
}
100% {
transform: translate(0, -0px);
}

so yeah the footer wont float but you will have your floaties not in the main, hope this helped you and whoever had the same issue and saw this comment. keep coding and decorating yall i love seeing all the amazing and creative pages in spacehey

by K00LAIDMNSTR6; 1727894060; Report