Printable Version of Topic
Click here to view this topic in its original format Forums > General Support > Mini Profile Issues

Posted by: EliteKilljoy Dec 6 2017, 04:51 PM
Have some trouble with some mini profiles

I have a few questions, so I hope it's okay that I post them both here.

1. My mini profile is supposed to be a hover, but when you hover over it, it shows up for a second and goes away.

2. My avatar is repeating for some reason on my mini profile. Like it's not wide enough so it tries to repeat the image next to it.

Any help is appreciated. Thanks~

Posted by: Dusty Dec 6 2017, 05:33 PM
1) The transition class .lilav:hover .lilleomrids has an incorrectly set margin-top property. It is currently -400px, whereas it should be 0

2) The avatar element needs to have its background attributes set appropriately - more specifically, background-repeat needs to be set to no-repeat, and if you're looking to get rid of the clip, background-size and background-position need to be set to contain and center, respectively. You can also conjugate this into one background CSS property, eg: url('') no-repeat center/contain

Posted by: EliteKilljoy Dec 6 2017, 06:01 PM
That fixed it, thank you so much!

EDIT: Ah, there is one more thing, actually. There seems to be a space before where it says "Bio:" and I could just be missing a space somewhere? I'm not sure if it's a coding thing or not, oof.

Here's my mini profile code:

<div class="navnbag"><div class="navnavn"><!-- |name| --></div><div class="undernavn"><script>if('<!-- |field_1| -->' == '') { document.write('N/A'); } else { document.write('<!-- |field_1| -->'); }</script> <span style="color:#832520">•</span> <!-- |member_group| --> <span style="color:#832520">•</span> <!-- |title| --></div></div>

<div style="background-image: url(<!-- |avatar_url| -->);" class="lilav"><div class="lilleomrids"></div>

<center><div class="storeomrids"><div class="lilleting"><div class="lillinfo"><span style="color:#832520"><b>BIO:</b></span> <a href="<!-- |field_7| -->">LINK</a></div>

<div class="lillinfolinje"><span style="color:#832520"><b>AGE:</b></span> <script>if('<!-- |field_3| -->' == '') { document.write('N/A'); } else { document.write('<!-- |field_3| -->'); } </script></div>

<div class="lillinfolinje"><span style="color:#832520"><b>PRONOUNS:</b></span>
<script>if('<!-- |field_5| -->' == '') { document.write('N/A'); } else { document.write('<!-- |field_5| -->'); } </script></div>

<div class="lillinfolinje"><span style="color:#832520"><b>ULTIMATE:</b></span> <script>if('<!-- |field_6| -->' == '') { document.write('N/A'); } else { document.write('<!-- |field_6| -->'); } </script></div>

<div class="lillinfolinje"><span style="color:#832520"><b>POSTS:</b></span> <!-- |member_posts| --></div>

<div class="lillelinkomrids"><div class="lillelinks"></div><div class="lillelinks"><a href="<!-- |id| -->"  title="PM User"> <i class="fa fa-envelope-o"></i></a></div></div></div><div class="crookedlille"></div></center></div>

Posted by: Dusty Dec 6 2017, 06:25 PM
.lillinfo, which contains the bio line, and .lillinfolinje have a width disparity. Match the widths, and preferably the padding as well, to rectify it.

Posted by: EliteKilljoy Dec 6 2017, 06:28 PM
Fixed it, thank you again!

Powered by Invision Power Board (
© Invision Power Services (