Positioning element on header

I've tried to use this code:

Code:

<div align="center" style="position:absolute; top:40px; left:65%; width:293px; height:126px;"><a href="http://www.team-xenon.com/sponzorstvo-h1.htm"><img src="http://i61.servimg.com/u/f61/11/81/90/13/sponzo10.png" width="293" height="126" border="0"/></a></div>

But absolute div counts % from the left side of the SCREEN to the right, it means that on every other resolution width the image will be placed on the other place.

I'm trying to set the div so it shows up on the same place for every screen resolution.... It would be nice when i could type left:50%+350px; but it can't be done xD

So i need an alternative, probably something i'm yet not aware of... Are there any opinions ?

BTW I'm using invision for my forum, so i can't add it with template editing... only in widgets/homepage message...

65% left will do fine, but i just want to know if theres any other option ?
On 1600x1200 the image is placed on totally wrong place, and it sticks out of the header... about 5-6 cm

Hello,

To make it look perfect on every screen resolution, try applying pixel measurements. If you want the image to display on right side, its better you use "right" instead of left.

For example, remove left:65%; and use right:100px; instead of that.

Hope that helps

I'm going to try it right away, please stay here I'll edit this post as soon as I see it

EDIT: Nope, its even worse this way... it counts from left to right as well from right to left hah xD

hmmmm
Then it seems difficult.

If you had template editing, you could put the div in the header and then apply position:relative;. It could help

Best way to do this is to use pixels instead of percentage. You can count margins of wrap, padding of header, width of logo image and then decide value for left : ?px;.

I tried all of those trust me I'm trying to find an alternative to absolute div...

Yea it would be a lot easier with relative div... But i just can't change theme version (again), I've changed it to punBB, edited template files, in several days, and then, a day after that, all of them just went back to default... I don't want it to happen again...

Ok, tell me where exactly are you putting the code?
In forum description or homepage message?

Relative position is not a proper solution for this. It will keep the div inside the parent container and won't let it move freely.

in the widgets, so it can show on every page...

if i add it to homepage message it would show only on forum index, and i think it can't get whole into description (i'm quite positive)

Then I think there is no close substitute for absolute position.
Relative position will force the div to remain inside the widget, so it will not be helpful.

I've found the solution:

Code:

<center><div align="right" style="position:absolute; top:40px; width:960px; height:126px;"><a href="http://www.team-xenon.com/sponzorstvo-h1.htm"><img src="http://i61.servimg.com/u/f61/11/81/90/13/sponzo10.png" width="293" height="126" border="0"/></a></div>
</center>

I've had to place it in homepage message, and now i have a problem of it not displaying on EVERY PAGE of the forum.

If i put it on widgets the

Code:

<center>

tag won't work... It will then position it ABOVE the widget and centered, that means it will move it to the right for as much as pixels as the width of the div.

And yes, i know what some of you mean, why I just don't put right: -50px;
that has the totally opposite effect, it sort of deactivates the center tag I've placed before, and i can't put make it static without center tag...

So i need a place where to put this code. Only in homepage message i can use it properly, but i need it on ALL of the pages... any suggestions ?