images overlay

**benosullivan** · 04-19-2005, 03:14 PM

Dear all,

MWINTER gave me the following CSS code to overlay hyperlink images onto a background - can someone see which attributes define the position of the overlayed images?

Thanks
Ben

<head>


<style type="text/css">
#container {
background: url(http://www.example.com/background.jpeg) #000000 no-repeat;
color: #ffffff;
position: relative;
height: <nn>px;
width: <mm>px;
}
#container a {
position: absolute;
}
#container a img {
border-style: none;
}

#blah {
top: <y>px;
left: <x>px;
}
</style>
</head>

<body>
<div id="container">
<a id="blah" href="..."><img alt="text equivalent of image" src="..."></a>
</div>
</body>

**jscheuer1** · 04-20-2005, 06:48 AM

The way I understand it you use 'blah'. Like:

Code:

......
#blah {
top: 120px;
left: 200px;
}
</style>
</head>

<body>
<div id="container">
<a id="blah" href="..."><img alt="text equivalent of image" src="..."></a>
</div>

the next image's anchor tag could have any id, say 'bleh'.

Code:

......
#blah {
top: 120px;
left: 200px;
}

#bleh {
top: 170px;
left: 260px;
}

</style>
</head>

<body>
<div id="container">
<a id="blah" href="..."><img alt="text equivalent of image" src="..."></a>
<a id="bleh" href="..."><img alt="text equivalent of image" src="..."></a>
</div>

and so on.

**benosullivan** · 04-22-2005, 09:37 AM

thanks Mike - I'll have a look,

Ben

Thread: images overlay

Thread Tools

Search Thread

images overlay

Bookmarks

Bookmarks

Posting Permissions