Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

need to make only the logo clickable on the header

Posted on 2011-03-25
6
Medium Priority
?
343 Views
Last Modified: 2012-05-11
Hi!

I have a header at the top of this page.
http://www.orlando-web-hosting.net/
Currently, the whole header is clickable.
I need only the logo clickable and would like to move as much of this code into a CSS rule.

I am currently using the below listed code:

<tr>
                <td><a href="/"><img src="images/owh_header.gif" style="width:750px;height:128px;border:0px" alt="Orlando Web Hosting LLC - Providing full service web and e-mail hosting, Site Studio site creator, e-commerce cart, ssl certificates and domain registration. Located in Orlando, Florida."></a></td>
</tr>

Any specific code modifications would be appreciated.
0
Comment
Question by:TrueBlue
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
6 Comments
 
LVL 9

Expert Comment

by:jkofte
ID: 35214690
you can use image mapping for that.

check this link. it is pretty easy.

http://www.w3schools.com/TAGS/tag_map.asp
0
 
LVL 40

Expert Comment

by:Gurvinder Pal Singh
ID: 35214710
try using image Map and do not use anchor tag

<img src="images/owh_header.gif" width="145" height="126" alt="Planets" usemap="#planetmap" />

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun" />
\\put the coordinates of the logo above
</map>
0
 

Author Comment

by:TrueBlue
ID: 35214761
I would greatly appreciate a more specific answer.
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 9

Expert Comment

by:jkofte
ID: 35214794
<td><img src="images/owh_header.gif" style="width:750px;height:128px;border:0px" alt="Orlando Web Hosting LLC - Providing full service web and e-mail hosting, Site Studio site creator, e-commerce cart, ssl certificates and domain registration. Located in Orlando, Florida." usemap="#map1">
<map name="planetmap">
  <area shape="rect" coords="0,0,120,120" href="/index.html" alt="Orlando Web Hosting" /> 
</map>
</td>

Open in new window

0
 
LVL 40

Assisted Solution

by:Gurvinder Pal Singh
Gurvinder Pal Singh earned 800 total points
ID: 35214803
when you use image mapping, you can specify a specific spot on the image to be used as a link. In your case, you don't need the wrapper of anchor tag on the img tag

<img src="images/owh_header.gif" width="145" height="126" alt="Planets" usemap="#planetmap" />

<map name="planetmap">
  <area shape="rect" coords="17,6,63,94" href="/"/>
</map>
0
 
LVL 9

Accepted Solution

by:
jkofte earned 1200 total points
ID: 35214804
<map> name should be map1 here.


<td><img src="images/owh_header.gif" style="width:750px;height:128px;border:0px" alt="Orlando Web Hosting LLC - Providing full service web and e-mail hosting, Site Studio site creator, e-commerce cart, ssl certificates and domain registration. Located in Orlando, Florida." usemap="#map1">
<map name="map1">
  <area shape="rect" coords="0,0,120,120" href="/index.html" alt="Orlando Web Hosting" /> 
</map>
</td>

Open in new window

0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

610 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question