MyBB Community Forums

Full Version: gettign a div to go over postbit avatar
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I am trying to get a div that holds the username in the postbit to float on top of avatars, but everything just wants to hide behind the avatar. I am not sure how to get it to show up on top of it?
Bump :3
Do you have a link that we can look at? Or if it isn't public, can you put the code into a jSFiddle or something like that? Hard to help this sort of problem when we can't see it. Smile
Sure :3 I've tried several things so far in the css to try and get the div on top of the avatar.

http://i.imgur.com/rZl3bzE.png This is a screenshot of how it currently looks on my screen. I want the top bar that has my username to float a bit on top of the image, you can see larger image, which is the main avatar you plug into the user cp, and then some other images starting beneath it, but they don't go on top of it either.

Postname is for the div with the username in it. I've tried making it a float, and using margins but everything I've tried still makes it hide behind the avatar. I've tried adding z-index in too but it hasn't worked either.

.postname {
background-image: url(http://i.imgur.com/3Y58iI3.png);
text-align: left;
font-family: Georgia;
font-size: 12px;
letter-spacing: 2px;
font-variant: small-caps;
padding: 2px;
}
Hmm, well, I can see what you're trying to do, but it could honestly be any number of things in the CSS or HTML. Can you provide a working link where you're trying to implement this?
Yes, this is where I am testing it at - http://myth-rpg.com/forum/showthread.php?tid=9
Okay, it's a pretty straight forward fix, you'll just want to check it with multiple posts to make sure everything is lining up properly.

to your .postname CSS, add:

position: relative;
top: 50px;

It will look like this: 
[attachment=32532]

You can then adjust the different positioning values: top, bottom, left, and right to get the look you're wanting.
omg thank you so much! Big Grin <333 I appreciate all of your help!
one more question if you don't mind? I tried moving it around a little and now its pushing the avatar down and I'm not sure how to keep it from doing that?