Trying to display hyperlinked image via css

[spiros]

I am trying to use this:

Code Select Expand

<a id="slnk" href="side.html" target="_blank">

Somewhere in index.template.php

And I add this in my css:

Code Select Expand

a#slnk
{
background-image:url(transt.gif);
background-repeat: no-repeat;
width:38px;
height:201px;
display:block;
margin-left:-15px;
margin-top:240px;
z-index:999999;
}

When testing with a simple html page /css (attached) it works just fine, displaying the hyperlinked image on the left. When trying to put the html line somewhere in index.template.php I get no image appearing.

What am I missing here?

[Kindred]

1 - have you tried using firefox + firebug to determine the display?
2 - where in index.css are you putting your definition?   because, if the regular a definition happnes lower in the file, it could be replacing yours... or something else could be interfering base on space, etc...

[spiros]

1 - yes, my problem is that it cannot be positioned on a fixed place, it will change as page length changess. I have placed the html above the xhtml validation link.
2 - top of css

[Kindred]

2 - top of css

That is part of your problem right there... additions to the core CSS should be added at the end of the file

[spiros]

I tried both, no avail, I found no way to have the same behaviour as it has now here https://www.translatum.gr/forum/index.php

The only way I could do it was with something like this for html:

Code Select Expand

<div id="fixed1"><a href="side.html" target="_blank"><img id="hd" alt="" /></a></div>

And this for css:

Code Select Expand

#fixed1 { position: relative; top: 240px; left: 0px; width: 38px; height: 210px; z-index:999999 }

#hd
{
    margin: 0px auto;
    border: none;
    background: url(transt.gif) no-repeat bottom;
    width: 38px;
    height: 201px;
}

Which resulted with a non removable outline displayed around the image due to the "img id" tag.