Hi there, I tried to add an overlay to my pet's profile. I manage to get the overlay to show but then the stats suddenly appeared and is in an odd location. I was wondering if anyone can help me fix it.
HappyBear's profile
<style>
/* A free Pet Profile created by FallenSamurai, avaliable at https://subetagraphics.proboards.com */
/* ------------------ Overall ------------------ */ html { margin: auto !important; width: 100%; height: 100%; background: url(http://images.forwallpaper.com/files/thumbs/preview/12/126385__vintage-letters-envelopes-postcards-stamps-perfume-brooch_p.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-color: green; }
body { width: 760px; height: auto; margin: 0 auto; position: relative; background: transparent; margin-top: 50px; margin-bottom: 50px; font-size: 10px; color: ; }
h2, , , , , , , , , .pet_age_info_date, .pet_wco_info_date { display:none; }
a:link, a:visited, a:hover { color: ; }
, { height: auto !important; background-color: rgba(255,255,255,1); margin-left: 0px; padding: 0px; min-width: 100%; }
{ background: transparent; }
{ width: auto; padding: 25px 25px 0; }
/* ------------------ DO NOT TOUCH ------------------ / ::after { content: 'free profile by FallenSamurai @ subetagraphics.proboards.com'; font-size: 9px; margin-left: 2px; } / ------------------ END DO NOT TOUCH ------------------ */
/* ------------------ Minion ------------------ */
{ width: 200px; height: 163px; margin: 0; padding: 0; font-size: 10px; }
/* ------------------ Pet Info ------------------ */
{ width: 290px; }
.pet_name { font-family: georgia; }
.pet_color_info { position: relative; top: -15px; }
.owner { position: relative; top: -15px; }
{background-image: url(https://68.media.tumblr.com/cb18e43dde54f05f8fb53c98d45d239e/tumblr_omiyj5emri1qcx0gbo1_250.jpg) } width: 250px; height: 250px; margin: 0 auto; background-position: 50% 50%; background-repeat: no-repeat; }
/* ------------------ Stats ------------------ */
{ display:none; }
/* ------------------ Spotlight ------------------ */
.pet_spotlight { position: absolute; left: 525px; top: 15px; width: 210px; height: 163px; padding-top: 20px; font-size: 10px;
}
/* ------------------ Pet Description ------------------ */
{ padding-bottom: 20px; padding-top: 20px;
}
/* ------------------ Pet Treasure ------------------ */
{ }
.treasure_item { margin-right: 6px; margin-bottom: 6px; }
.treasure_item img, .treasure_item { width: 64px; height: 64px; }
/* ------------------ Pet Friends ------------------ */
{ }
.friend_div { display: block; height: auto; margin: 3px; padding: 5px; text-align: center; width: 100px; }
</style>
it's because of the } in this block :) just remove it and it should be back to normal
{background-image: url(https://68.media.tumblr.com/cb18e43dde54f05f8fb53c98d45d239e/tumblr_omiyj5emri1qcx0gbo1_250.jpg) } width: 250px; height: 250px; margin: 0 auto; background-position: 50% 50%; background-repeat: no-repeat; }
I tried removing the extra } but then my overlay doesn't show.. :$
You need to remove this part in the pet overlay section:
width: 250px; height: 250px; margin: 0 auto; background-position: 50% 50%; background-repeat: no-repeat; }
edit: ok wait hold on edit edit: okay yeah!! it was the semicolon that you needed, i placed it after the ). you can just copy and replace the block you have with the one below. or just remove the } as i mentioned and add in the semicolon yourself.
{background-image: url(https://68.media.tumblr.com/cb18e43dde54f05f8fb53c98d45d239e/tumblr_omiyj5emri1qcx0gbo1_250.jpg); width: 250px; height: 250px; margin: 0 auto; background-position: 50% 50%; background-repeat: no-repeat; }