I have a picture that i need to have certain parts selected (facebook logo and the twitter logo) please help me with the code. Thanx. Heres de pic

http://www.htmlcodetutorial.com/imag...msupp_220.html

how can i find the co-ords?

Use CSS, not an inaccessible image map. That logo could be a background with the social icons floated in the div and linked.

Best that you should separate the facebook & twitter icons from the "entertainment anytime" image. Then, use css to style the background of the div with the "entertainment" image. Use css to get the proper styling/placement of the social icons.

you have to use image mapping areas tags to select different areas of pixels and create links etc

No, you do NOT. Did you not read the other posts here? Image maps are bad for accessibility and, at this point with CSS, outdated.

Hi,
Place the big image as a background
for a div and place social networking
icons as a image i.e <div class="something"><imgsrc="yourpics"/></div>
if you want t it to be at top-right give float:right
in left give float:left this will solve your problem

If you cannot cut out this two logos because this is not simple background then just put this image in div background, define one div for links and a tags. Below is simple example and work OK in all good browsers, but for IE6 (and maybe some other) you need hack.

CSS

#header {
	width: 624px;
	height: 257px;
	background: transparent url("networks.jpg") no-repeat 0 0; 
}
#bottom_header {
    float:left;
	width: 624px;
	height: 50px;
	margin: 200px 0 0 0;
}
a.face_twit{
	float: right;
	width: 50px;
	height:50px;
	display: block;
	margin: 0 8px 0 0;
	text-decoration: none;
}

HTML

<div id="header">
   <div id="bottom_header">
     <a class="face_twit" href="#">&nbsp;</a>
     <a class="face_twit" href="#">&nbsp;</a>
   </div>
</div>