Border around an href img

I know this is going to turn out to be obvious, but....
http://www.fourcreeks.org/may-creek-basin/watersheds.htm
The main image is included in an <a href> to make it a
hyperlink. Before I added the link there was no border around the
image; now there is.
I've tried to set the style for the <a> to border:0;
text-decoration:none; background:transparent but nothing seems to
remove the border that was added when the link was created.
What do I need to do to get rid of the border around the
linked image?
Thanks
Tom

On 27 Sep 2006 in macromedia.dreamweaver, TCarp wrote:
> I need to bring this topic back up. Using the img border
0 worked
> for the initial border around the image, but now I'm
noticing that I
> get a dashed border around the image when the link has
been visited.
> I experimented with a:visited img, a img:visited and a
few other
> combinations but nothing worked.
>
> How do I totally eliminate any borders around images
used as links
> in any state (hover, visited, etc.)?
That's an accessibility feature, so that those using adaptive
devices can
see where they are on the page. You can eliminate it - do a
web search
for 'link scrubber' - but it makes your pages less
accessible.
Joe Makowiec
http://makowiec.net/
Email:
http://makowiec.net/email.php

Similar Messages

I can't get rid of this blue border around my artwork after it's published to the web

I can't get rid of this blue border around my artwork after it's published to the web

That did not work.
Here's where I put it. The blue bordeer still show up around the large rectangular image.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ray Bros., Inc.</title>
<style type="text/css">
@import url("PopupMenuC.css");
@import url("PopupMenuB.css");
@import url("PopupMenu1.css");
body {
          margin-left: 00px;
          margin-top: 00px;
          margin-right: 00px;
          margin-bottom: 00px;
          text-align: center;
a img {border:none}
.Arial {
          font-family: Arial, Helvetica, sans-serif;
.Arial {
          font-size: 10px;
.Arial {
          font-size: 12px;
.Arial .Arial {
          font-size: 14px;
</style>
<script language="JavaScript1.2" type="text/javascript" src="mm_css_menu.js"></script>
</head>
<body>
<table width="1080" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
    <td height="279" align="center" valign="top"><div id="FWTableContainer1818523225"> <img name="PopupMenuC" src="PopupMenuC.jpg" width="1082" height="279" id="PopupMenuC" usemap="#m_PopupMenuC" alt="" />
      <map name="m_PopupMenuC" id="m_PopupMenuC">
        <area shape="rect" coords="899,240,1064,265" href="index-new.html" alt="" />
        <area shape="rect" coords="679,240,844,265" href="index-new.html" alt="" />
        <area shape="rect" coords="460,240,625,265" href="javascript:;" alt="" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MMMenuContainer0525123758_0', 'MMMenu0525123758_0',485,265,'PopupMenuC');" />
        <area shape="rect" coords="241,240,406,265" href="javascript:;" alt="" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MMMenuContainer0524224504_0', 'MMMenu0524224504_0',262,265,'PopupMenuC');" />
        <area shape="rect" coords="22,240,187,265" href="javascript:;" alt="" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuShowMenu('MMMenuContainer0524221503_1', 'MMMenu0524221503_1',46,265,'PopupMenuC');" />
      </map>
      <div id="MMMenuContainer0525123758_0">
        <div id="MMMenu0525123758_0" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuResetTimeout();"> <a href="index-new.html" id="MMMenu0525123758_0_Item_0" class="MMMIFVStyleMMMenu0525123758_0" onmouseover="MM_menuOverMenuItem('MMMenu0525123758_0');"> RBI-NS100 </a> <a href="index-new.html" id="MMMenu0525123758_0_Item_1" class="MMMIVStyleMMMenu0525123758_0" onmouseover="MM_menuOverMenuItem('MMMenu0525123758_0');"> RBI-M100 </a> <a href="index-new.html" id="MMMenu0525123758_0_Item_2" class="MMMIVStyleMMMenu0525123758_0" onmouseover="MM_menuOverMenuItem('MMMenu0525123758_0');"> RBI-100 </a> <a href="index-new.html" id="MMMenu0525123758_0_Item_3" class="MMMIVStyleMMMenu0525123758_0" onmouseover="MM_menuOverMenuItem('MMMenu0525123758_0');"> Color Charts </a> </div>
      </div>
      <div id="MMMenuContainer0524224504_0">
        <div id="MMMenu0524224504_0" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuResetTimeout();"> <a href="index-new.html" id="MMMenu0524224504_0_Item_0" class="MMMIFVStyleMMMenu0524224504_0" onmouseover="MM_menuOverMenuItem('MMMenu0524224504_0');"> RBI-5V </a> <a href="index-new.html" id="MMMenu0524224504_0_Item_1" class="MMMIVStyleMMMenu0524224504_0" onmouseover="MM_menuOverMenuItem('MMMenu0524224504_0');"> RBI Low Profile AGG </a> <a href="index-new.html" id="MMMenu0524224504_0_Item_2" class="MMMIVStyleMMMenu0524224504_0" onmouseover="MM_menuOverMenuItem('MMMenu0524224504_0');"> Color Charts </a> </div>
      </div>
      <div id="MMMenuContainer0524221503_1">
        <div id="MMMenu0524221503_1" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuResetTimeout();"> <a href="index-new.html" id="MMMenu0524221503_1_Item_0" class="MMMIFVStyleMMMenu0524221503_1" onmouseover="MM_menuOverMenuItem('MMMenu0524221503_1');"> RBI-MT240 </a> <a href="index-new.html" id="MMMenu0524221503_1_Item_1" class="MMMIVStyleMMMenu0524221503_1" onmouseover="MM_menuOverMenuItem('MMMenu0524221503_1');"> RBI-200 </a> <a href="index-new.html" id="MMMenu0524221503_1_Item_2" class="MMMIVStyleMMMenu0524221503_1" onmouseover="MM_menuOverMenuItem('MMMenu0524221503_1');"> RBI-175 </a> <a href="index-new.html" id="MMMenu0524221503_1_Item_3" class="MMMIVStyleMMMenu0524221503_1" onmouseover="MM_menuOverMenuItem('MMMenu0524221503_1');"> R-Panel </a> <a href="index-new.html" id="MMMenu0524221503_1_Item_4" class="MMMIVStyleMMMenu0524221503_1" onmouseover="MM_menuOverMenuItem('MMMenu0524221503_1');"> Color Charts </a> </div>
      </div>
    </div></td>
</tr>
<tr>
    <td valign="top"><p><br />
    </p></td>
</tr>
<tr>
    <td> </td>
</tr>
<tr>
    <td> </td>
</tr>
<tr>
    <td>...</td>
</tr>
<tr>
    <td> </td>
</tr>
</table>
</body>
</html>

Black border around hotspots in Image map?

I have an image map in my HTML file that contains three
circular hotspots. When they're viewed in a browser, each one has a
black border around it after it's clicked on. I've seen other help
threads on the border problem talk about putting 'border:none" in
the IMG tag, but there's no IMG tag..it's an image map and border
is already set to "0". The code is below:
<map name="satelliteLinks">
<area shape="circle" coords="94,64,41" href="
http://gi.leica-geosystems.com/LGISub5x307x0.aspx"
target="_self" />
<area shape="circle" coords="297,51,48" href="
http://www.erdas.com/erdasCompanyNews.aspx"
target="_self" />
<area shape="circle" coords="517,59,43" href="
http://www.erdas.com"
target="_self" />
</map>
Any suggestions would be very helpful as my deadline to have
this complete is today!!

jgleica wrote:
> I have an image map in my HTML file that contains three
circular hotspots. When
> they're viewed in a browser, each one has a black border
around it after it's
> clicked on. I've seen other help threads on the border
problem talk about
> putting 'border:none" in the IMG tag, but there's no IMG
tag..it's an image map
> and border is already set to "0". The code is below:
> <map name="satelliteLinks">
> <area shape="circle" coords="94,64,41"
> href="
http://gi.leica-geosystems.com/LGISub5x307x0.aspx"
target="_self" />
> <area shape="circle" coords="297,51,48"
> href="
http://www.erdas.com/erdasCompanyNews.aspx"
target="_self" />
> <area shape="circle" coords="517,59,43" href="
http://www.erdas.com"
> target="_self" />
> </map>
>
> Any suggestions would be very helpful as my deadline to
have this complete is
> today!!
>
Thats the way the web works, its an accessibility feature, as
its how
you can tab around the page and see where the links are. Look
at any
website, click the link, and see what happens.
Steve

Border around image link?

Hello,
I created this HTML email and only in gmail there is a purple border around the header link? I have the border setup to O. It looks great in hotmail and outlook though. Do you know why this would happen?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Guardian Credit Union</title>
<style type="text/css">

</style>
</head>
<body>
<table width="625" border="0" cellspacing="0" cellpadding="0">
<tr>
    <td border="0"><a href="http://www.tellgcu.com/{{Purl}}"><img src="http://208.69.110.181/GCU_919743-site/images/emailHeader.jpg" alt="Urgent deadline regarding your debit/ATM card services. To keep the overdraft service you already have, we need to hear from you." /></a></td>
</tr>
<tr>
    <td><p class="style1">Dear {{CustomerName}},<br><br>In order to continue giving you the same Overdraft Services you are receiving today, we will need your permission by August 15th.</p>
      <p class="style1">Overdraft Services allow us to cover debit card purchases or ATM withdrawals for you when the transaction is more than your balance. </p>
    <p class="style1">You can choose to continue receiving that service, or to have the debit card purchase declined at the cash register. <a href="http://www.tellgcu.com/{{Purl}}">Click here to find out more!</a></p></td>
</tr>
<tr>
    <td><br><p class="style1">Sincerely,<br><br><br>Guardian Credit Union</p><br><br><br><font size="-2pt">You will be charged a paid item overdraft fee of $32 for each overdrawn item created by Debit Card purchases or ATM withdrawals. The amount of any overdraft item including our paid item overdraft fee of $32 shall be due and payable upon demand, but if no demand is made, no later than 30 calendar days after the creation of the overdraft. We may refuse to pay an overdraft item at any time even though we may have previously paid overdrafts for you. For example, we typically do not pay overdraft items if your account is not in good standing or if based upon our review of your account management, we determine that you have too many overdrafts or are using the service as a regular line of credit.</font></td></tr>
</table>
</body>
</html>
THanks,
Melanie

i know im a bit late on responding but i think what you need to do mshef534 is to put the code a img {border: 0px;} within the image ref itself i.e.
<a href="http://www.facebook.com/search/results.php?q=Samuel+Emerton&init=public#!/profile.php?id=1 00000235960932"target="_blank"><img src="facebook.png" width="43" height="43" a img {border: 0px;}/> and that should do it this worked for me happy htmling

Border around some links...

Borders around menu options on certain pages and not sure why
I created the pages in Photoshop, used Imageready to output
my site to HTML, then linked everything in Dreamweaver.
On most of the pages there are no problems, but certain pages
http://www.fcsafehouse.com/classes.html
* have a border around the menu item.
I checked the slices and made sure there was no gap in
between spacers and menu item.
Um help??
Also have odd spacing once I added links to the menu on
contact page

Use CSS -
a img { border:none; }
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"Lonewulph" <[email protected]> wrote in
message
news:fbfd53$g0i$[email protected]..
> Borders around menu options on certain pages and not
sure why
>
> I created the pages in Photoshop, used Imageready to
output my site to
> HTML,
> then linked everything in Dreamweaver.
>
> On most of the pages there are no problems, but certain
pages *
>
http://www.fcsafehouse.com/classes.html
* have a border around the menu
> item.
>
> I checked the slices and made sure there was no gap in
between spacers and
> menu item.
>
> Um help??
>
> Also have odd spacing once I added links to the menu on
contact page
>

Removing border around image with link

I know this is really basic but I can't find anywhere how to
avoid having a purple border around a linked image. Help
please!

Nope. Not if you want valid XHTML.
CSS does the trick -
a img { border:none; }
*and* you don't have to add it to each individual <img>
tag.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"Dan.Smith" <[email protected]> wrote in
message
news:gn22if$i6k$[email protected]..
> border="0"
>
> <img src="myImage.jpg" alt="a" width="22" height="22"
border="0" />
>
> --
> Dan Smith > adobe community expert
> Flash Helps >
http://www.smithmediafusion.com/blog/?cat=11
> twitter:
http://twitter.com/dmode
>

Border around image

How do I take the border around the image away: http://marketingsource.businesscatalyst.com/lists/business?Preview=True
need help ASAP!

Hi there,
Your URL is lukily live but that preview link , so you know only works if your logged into your site...
http://marketingsource.businesscatalyst.com/lists/business
style.css line 256 has..
#content img, .imageborder
This element has a background of white, padding and box shadow. It is not actually a border.

Border around a picture tha hav a link

When i put a link to a picture, I see a border around the picture when I open the page in IE, but not in Crome. Is it possible to not see the border in IE?
Knut Erik

Sure - use this CSS rule:
a img { border:none; }

Red Border Around Logo on PC browsers

There is a thin red border around the logo on the site I am creating. I am on a Mac and didn't notice this issue until I was troubleshooting on a PC. The red border only appears on PCs.
I viewed my site in Firefox, Safari, and Chrome on the mac. No red border.
I viewed the site in IE and Firefox on PCs. Red border.
Anybody know the issue? (I'm thinking it has something to do with the a link values because the color changes from red to blue after the image is clicked.)
http://www.jgraveslawyers.com
a:link {
text-decoration: none;
color: #900;
background: transparent;
a:visited {
text-decoration: none;
color: #006;
background: transparent;
a:hover {
text-decoration: none;
color: #F00;
background: transparent;
a:focus {
text-decoration: none;
color: #fff;
background: #6196BC;
a:active {
text-decoration: none;
color: #600;
background: transparent;

It doesn't have to do with that. You need to remove the border from that instance. Now you could use:
a img { border: none; }
But that would eliminate the borders from around all images. If you only want the one image to have no border around it you should just have to use the border: none attribute on the img tag (ie: style="border:none;" inside the <img> tag).

Border around link image

I placed an image, then linked it. Now I have a bright blue
box around it. Any ideas on why it is doing this?

Use CSS with this rule -
a img { border:none; }
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"cdeatherage" <[email protected]> wrote in
message
news:el1sem$snk$[email protected]..
> The default designation in most browsers indicates links
by changing the
> text
> to blue and adding an underline or placing a blue border
around an image.
> [The
> end user can change that in his/her browser preferences,
but that is
> another
> issue.] Because you made the image a link, your browser
is showing the
> border
> around the image.
>
> The only way you can get around that is, in DW go to
page properties and
> re-set the colors for links to something that you like.
If this image is
> the
> only link on your page, you can just make the links
colors the same as
> your
> background, and it will disappear. If you have other
links on the page,
> however, this isn't going to be practical because they
will disappear, and
> that
> would not be a good thing.
>

Border around links

Just bought CS3 and dreamweaver adds a blue border to a link
when a pic is inserted. anybody know why or how to turn it off?
Thanks
gcs

CS3 wants you to learn/use CSS.
1] Select the image on the page and type 0 for the Border in
the
Property Inspector.
2] Or better - add this to your CSS to remove the border
around every
image link:
a img {
border: none;
Alec
Adobe Community Expert

How can I create a border around an image in cs6?

I would appreciate advice on how to place a border around an image in cs6.
Thanks in advance.

To add to the previous responses, if you want this only for 1 image on your page, you could either assign a specific ID or CLASS to the DIV that holds that image and assign CSS for that in particular like this:
HTML
<img src="./your/path/to/img.jpg" id="imgwithborder" />
CSS
img#imgwithborder{
border: 1px solid black; /* will render a 1px solid black line on all 4 sides */
Alternatively, you could use inline styling to achieve this:
HTML:
<img src="./your/path/to/img.jpg" style="border: 1px solid black;" />
Good luck.

How do i get rid of a blue border around an image

Hey guys,
I have an image on my page that i am using as a link but it has a blue border around it. How do i get rid of this border

Add "a img { border: none; }" (without the quotes) to your stylesheet.

Jpg Link - Cant Change Border Around Link - Explorer

I am creating a website in Blues, oranges, and some greens. I
have made some simple jpg buttons in the color scheme. I set the
Page Property- Link color and Visited links to orange, which is
what I want - but in Explorer they have a Fuscia border around them
which really messes up my color scheme.(only the linked jpg's not
all the others) However, in Netscape the jpg/link border is orange,
as I set up, and they look good. What can I do to make the Fuscia
go away?

Add border="0" to the <img>:
<img src="image.jpg" alt="image description" width="300"
height="200"
border="0" />
Ken Ford
Adobe Community Expert - Dreamweaver
Fordwebs, LLC
http://www.fordwebs.com
"Betheanne_P" <[email protected]> wrote in
message
news:folqvp$ohk$[email protected]..
>I am creating a website in Blues, oranges, and some
greens. I have made
>some
> simple jpg buttons in the color scheme. I set the Page
Property- Link
> color and
> Visited links to orange, which is what I want - but in
Explorer they have
> a
> Fuscia border around them which really messes up my
color scheme.(only the
> linked jpg's not all the others) However, in Netscape
the jpg/link border
> is
> orange, as I set up, and they look good. What can I do
to make the Fuscia
> go
> away?
>

How do I print multiple (4) photos on one page with a border around each?

How do I print multiple photos on one page with a border around each? I've gone the contact sheet route and adjusted the number of columns but there's only outer margins and very little white space between the photos down the middle of the page.

Ok, now I feel stupid! I always thought I was printing 6 x 4 but now I realise I can't have done!!
The photos that I used to print are approx. 5.2" x 4" (i.e. 4 fitted nicely on a page & I had to cut the boarder off).
I guess I just need to play with different sizes under the 'custom' option in order to get the biggest possible picture!
Thanks for the help

Border around an href img

Similar Messages

Maybe you are looking for