Blue box around linked picture

I am trying to link some pictures on my homepage to other
pages in my site and when I link them, a blue box appears around
the picture. When I preview it in my browser, it gives me the
impression it is like a rollover or visited link. It turns the
default purple if I have clicked on it previously. I have changed
the page properties to make the link colors white, but that does
not help. Any suggestions or ideas??
Thanks!

Add this to your 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.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"cwgurl21" <[email protected]> wrote in
message
news:fin4o4$3mq$[email protected]..
>I am trying to link some pictures on my homepage to other
pages in my site
>and
> when I link them, a blue box appears around the picture.
When I preview it
> in
> my browser, it gives me the impression it is like a
rollover or visited
> link.
> It turns the default purple if I have clicked on it
previously. I have
> changed
> the page properties to make the link colors white, but
that does not help.
> Any
> suggestions or ideas??
>
> Thanks!
>

Similar Messages

Blue box around link wont go away

Im using DW cs3 and trying to redo a website. I have
everything in place, but when I add a link to an animated gif in
center of my page, it adds a blue border around the image. How can
I turn this off?
I have a nav column on left side of page will rollover
effects and there is no blue box around those images.
If thats not bad enough, I also have an animated gif above my
nav column, and when I add a link to it, It gets a blue box as well
and expands my nav table. I havent experienced this with older DW.
Any ideas on what Im doing or not doing right?
*****Disregard. Finally figured out you have to put a 0 in
for border. I dont remember ever having to put that in before. I
may just be getting old.

"David Powers" <[email protected]> wrote in message
news:ffqc95$a4q$[email protected]..
> dellvostro wrote:
>> Im using DW cs3 and trying to redo a website. I have
everything in place,
>> but when I add a link to an animated gif in center
of my page, it adds a
>> blue border around the image. How can I turn this
off?
>
> Earlier versions of Dreamweaver automatically added 0 in
the Border
> attribute of an image if you embedded it in a link.
Dreamweaver CS3
> doesn't do so because it creates invalid code for HTML
Strict and XHTML
> Strict.
>
> A simple way to get rid of the blue border is to select
the image and type
> 0 in the Border field of the Property inspector.
>
> The better way to do it is to add the following rule to
your website's
> style sheet:
>
> a img {border:none;}
>
> Using the style rule is more efficient because the same
rule is
> automatically applied to all images embedded inside a
link in the same
> site.
Hi David - I thought he might want borders on some other
images on the page?
Patty Ayers | Adobe Community Expert
www.WebDevBiz.com
Free Articles on the Business of Web Development
Web Design Contract, Estimate Request Form, Estimate
Worksheet

How Do I get rid of a blue box around my picture "links"

Hi,
I had troubles finding out how to make a menu bar, so I went: insert>image objects> Image Placeholder, I uploaded a button I made at a website.. the image works fine, but somehow I have a blue bar around the image... How do i solve this? Also, how do you insert an interactive image (a button that links to another page on my website?
Thanks,
Chris

In your CSS add:
a img {
border: none;
and the blue box will go away.
Did you read that post yet? The purple is just the default color for a visited link, but that code in your CSS will remove all borders from the images with links.

How do I get firefox to stop displaying blue boxes around my linked images?

I am talking about Firefox 3.5 on mac.
I was wondering if there was some way of turning off link highlighting on my website in Dreamweaver or if there is some kind of code I have to enter.
What happens is that i have images with hyperlinks and firefox puts blue boxes around them and it is ugly.
Safari works perfectly so its not me.

The answer to this question, Getting rid of blue borders around links is in the Dreamweaver FAQ.

Blue box around image link

I seem to get this obnoxious blue box around all image links
I create in Dreamweaver cs3. Has anyone experienced this and if so
how do I get rid of that bugger

>I am very new to this, but the way I got round this
problem was to add
>border="0" after the height="xx" for that image.
That'll work but it requires border="0" to be individually
added to every
single <img> which is a link in every single page on
your site.
The method suggested by Alec is created just the once and
applies
automatically to every single <img> which is a link on
every page both now
and into the future i.e. nil maintenance.
I know which I prefer :-)
Regards
John Waller

How do I get rid of blue boxes around hotspots?

Hi there,
I've added three hotspots to this website, but after you click on them it leaves a non-so-pleasant blue box around them.
http://chanlegge.comjavascript:;http://chanlegge.com/
I should point out also that these appear for me in Safari and Chrome, but not Firefox.
I'm a complete dolt when it comes to webdesign (as you can see, the website is basically just two jpegs) and don't know about CSS etc, but I am hoping there is a simple way to avoid having these. Any ideas?
Thanks in advance,
Johnny

I must have been on the wrong page when I looked initially.
@JohnJohnJohn,
If you ever want to have a search engine index your site (so people can find you using Google and the like) you need to seriously reconsider what you're doing. Since your pages consist of a single image that is then mapped, there's nothing for the search engines to index in any meaningful way. Search engines rely on relevant, keyword rich, html text to give your site any kind of position in a viewer's search results. As far as the search engines are concerned, right now, your pages are blank.
Also, as it stands now, anyone with a screen reader will get what amounts to a blank page, even if they do happen across your site somehow.
Finally, the mailto links you are using won't do anything when clicked for any user who relies on browser based email clients (gmail, yahoo, hotmail, etc) because the mailto link activates email clients installed on the actual computer. If someone viewing your site without something like Outlook installed, clicking your mailto link does nothing. It's much, much better to use a form to email script (usually available from your hosting provider) to allow users to contact you no matter how their email is set up.

How to disable the blue highlight boxes around links?

I've created a document in InDesign CS5, and when viewed on Adobe Reader 10.2 (on an iPad) all the table of contents links within the document, and all links to external websites have a blue highlight field around them. While I appreciate the fact that it makes it obvious where links are, it looks remarkably ugly to have huge blue highlights all over the document. There must be a way to turn these highlights off, right? Either from the source document within InDesign before the PDF is created, or from within Adobe Reader or Acrobat after the PDF is made? I have all the links within InDesign set to "Invisible Rectangle", and it looks great when viewed on older versions of Adobe Reader or in iBooks. Unfortunately, older versions of Adobe Reader don't support hyperlinks on tablets. So somebody using Reader 10.2, however, is now forced to view this document with ugly blue highlights. Is the only option to avoid the highlights to recommend everyone use iBooks to view the document, or is there a way in Reader 10.2 to disable these?

Thanks, but I already have all the hyperlinks set to "Invisible Rectangle", and there are still blue highlight fields around the links in Reader 10.2. If I view the PDF in other programs (iBooks, older versions of Reader) the links appear without the blue highlights. All the research I've done on this seems to point to the blue highlight fields being a "feature" of Reader 10.2, but I can't imagine that Adobe would create a feature with such a visual impact on documents without offering the option to turn that feature off? In a lot of print, online, and interactive docs both text and images are used as links (icons, buttons, etc) and having an automatic blue highlight around them really takes away from the visual impact that graphics provide. There must be an option somewhere to disable or turn these off, but I haven't been able to find it yet. Any other suggestions/ideas?

Blue boxes instead of pictures

When ever i go on a page in safari that has pictures, i only see half of them. The rest show up as blue boxes with a question mark. Anyone know what's up?

That's normal. It means that the server where those images are obtained is not functioning or the image links themselves are no longer correct or no longer active. Nothing you can do about it except report it to the site's webmaster.

In my updated Pages 5.2, when I click on a specific shape to manipulate it, all the other shapes on the page have blue boxes around them. I cannot grab and work with one shape easily. Why?

I have a mac OS X, version 10.9.3 with Pages 5.2 (1860). When I create several shapes or text boxes on the page and try to click on just one, a blue box surrounds every item on the page so I can't edit the one specific item. Why?

Hello betsywetsy
It sounds to me like you have the shapes grouped together. Select them and either look in the Arrange pane of the Format inspector and towards the bottom you should see a Group and Ungroup button. Also you go to the drop down menu Arrange > Ungroup to do the same effect.
Layer, group, and lock objects
http://help.apple.com/pages/mac/5.2/#/tan5eab46568
Regards,
-Norm G.

Blue boxes w/ links in IE

I have linked social media icons to their respective pages, but they appear differently in different browsers:
- IE: a blue border surrounds the icons
- Firefox: a white border surrounds the icons **this is how it is supposed to appear
- Safari: no border around the icons
The only thing that bothers me is the blue border in IE. Is there anything I can do to change this?
Here is the code for the page:
<!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>zcomm- contact</title>

<style type="text/css">

</style>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script type="text/javascript">

</script>
<link href="CSS/navbar_elements.css" rel="stylesheet" type="text/css" />

<link href="CSS/text_styling.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>
<style type="text/css">

</style>

<style type="text/css">

</style>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
<link href="CSS/basic_template_CSS.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
<link href="CSS/text_styling.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
<link href="CSS/bottom_menu.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
<link href="Images/favicon.ico" rel="shortcut icon" />
</head>
<body class="oneColFixCtr">
<div id="container">
<div id="apDiv6"><img src="Images/logo_14_BG.gif" width="171" height="171" /></div>
<div id="apDiv8">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a class="MenuBarItemSubmenu" href="about.html">about</a>
        <ul>
          <li><a href="overview.html">overview</a></li>
          <li><a href="z team.html">z team</a></li>
          <li><a href="careers.html">careers</a></li>
        </ul>
      </li>
      <li><a href="our services.html">our services</a></li>
      <li><a class="MenuBarItemSubmenu" href="newsroom.html">newsroom</a>
        <ul>
          <li><a href="in the news.html">in the news</a>          </li>
          <li><a href="our news.html">our news</a></li>
          <li><a href="twitter lineup.html">twitter lineup</a></li>
        </ul>
      </li>
      <li><a href="our experience.html">our experience</a></li>
      <li><a href="contact.html">contact</a></li>
    </ul>
</div>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<div>
    <div id="apDiv13"><img src="Images/page titles/images/page-titles_13.gif" width="1000" height="155" /></div>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <div id="apDiv15">
      <p class="bodytext">zcomm<br />
        240-395-0225<br />
        240-395-0226 (fax)<br />
        7830 old georgetown road, suite 125<br />
        bethesda, md 20814<br />
      <a href="http://maps.google.com/maps?f=q&hl=en&q=7830+Old+Georgetown+Road&sll=37.0625,-95.677068&sspn=63.9851,91.230469&ie=UTF8&z=17&iwloc=addr&om=1">directions to our office</a></p>
      <p class="bodytext"> </p>
      <p class="bodytext">looking for us? or are we looking for you?<br />
        <span class="bodytext_small">zcomm wants to hear from you. Maybe you need our services. Maybe we need yours. Maybe you think you have the "z factor" and could be our next employee. Or maybe you just want to talk to someone who already works here and is in the know.</span><br />
      </p>
      <p class="bodytext"> </p>
      <p class="bodytext">new business<br />
        <span class="bodytext_small">zcomm welcomes the opportunity to discuss your marketing and PR needs and how we can meet and exceed them. Please contact <a href="mailto:[email protected]">Risë Birnbaum</a> at 240-395-0225, ext. 103 or <a href="mailto:[email protected] ">Joan Carrese Sineni</a> at 240-395-0225 ext. 101.</span><br />
      </p>
      <p class="bodytext"> </p>
      <p class="bodytext">vendor/supplier opportunities<br />
        <span class="bodytext_small">If you are interested in providing products or services to zcomm as a supplier partner, please contact <a href="mailto:[email protected] ">Tim Casey</a><a href="[email protected]"></a>, Chief Operating Officer, at 240-395-0225, ext. 105.</span><br />
      </p>
      <p class="bodytext"> </p>
      <p class="bodytext">employment<br />
        <span class="bodytext_small">If you are interested in employment opportunities, please see our careers at zcomm area or forward your resume to <a href="mailto:[email protected]">[email protected]</a>.</span><br />
      </p>
      <p class="bodytext"> </p>
      <p class="bodytext">staff directory<br />
        <span class="bodytext_small">For a list of staff members and their contact information, please visit our <a href="z team.html">z team </a>area.</span></p>
      <p class="bodytext"><br />
      </p>
      <p class="bodytext_centered"><span class="bodytext_centered_small">Have a comment? Want to know more about a service? Send us a note and we'll get back to you!</span></p>
    </div>
    <p class="bodytext"><br />
    </p>
<p class="tabbed_about"> </p>
    <div id="apDiv22">
      <p class="header_text">follow us</p>
      <p><a href="http://twitter.com/zcommunications"><img src="Images/twitter_button.gif" width="100" height="100" alt="twitter" /> </a><a href="http://www.facebook.com/pages/Bethesda-MD/zcomm-zcommunications/117284570233"><img src="Images/facebook_button.gif" width="100" height="100" alt="facebook" /> </a><a href="http://risebirnbaum.typepad.com/"><img src="Images/typepad_button.gif" width="100" height="100" alt="typepad" /></a></p>
    </div>
    <p class="tabbed_about"> </p>
    <p class="tabbed_about"> </p>
    <p class="tabbed_about"> </p>
    <p class="tabbed_about"> </p>
    <p> </p>
<p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <div class="footer_menu" id="apDiv17">
      <p>zcomm is a national, award-winning marketing communications firm offering the widest range of broadcast PR services available. We specialize in creating, packaging and distributing targeted client messages through the latest technology for a variety of industries: consumer product, healthcare, food and beverage, energy, corporate, government, telecomm, tech and more.</p>
      <p><a href="index.html">home</a> | <a href="about.html">about</a> | <a href="z team.html">z team</a> | <a href="careers.html">careers</a> | <a href="newsroom.html">newsroom</a> | <a href="http://www.radionewz.com/">radionewz</a> | <a href="our experience.html">our experience</a> | <a href="contact.html">contact</a></p>
    </div>
    <p> </p>
<p> </p>
<p> </p>
    <p> </p>
</div>
</div>
<script type="text/javascript">

</script>
</body>
</html>

Add this to the top of your css:
img a {border: none;}
Bob

How do I get rid of blue boxes surrounding links?

Viewing .pdf files in Reader on my Android tablet, all my links are shown in a light blue field. This looks terrible and does not happen when I view them in other .pdf readers.
How can I get rid of these???
Thanks!

I don't think you can change the text box field properties using Reader; you would need an Acrobat type of app. The blue field box lets you know there is an active hyperlink and not just blue print that is underlined. If you open the same pdf in another pdf viewer you probably see the url with a blue underline but it isn't active. Kind of frustrating to see a blue underlined url and it doesn't work when you want to jump to it. In Adobe Reader, the light blue field box lets you know the link is active and not just blue print that is underlined. If you want to be able to follow the link you won't be able to in other readers. It's also handy to be able to identify the active links to more easily avoid making an accidental jump. The hyper-link field boxes are not always blue - in a colored background they might look like shadows. The colored field box should not show when you print the doc or when you view on other than mobile devices.

Get rid of Dotted box around links with CSS

After I click a link on my site a dotted box appears around the link/image. From looking through the forums I have learned that this is a "focus state" used by people without a mouse to tab through the site and see where they are. I have also read the way to get rid of it was to put;
a:focus img { outline:none; }
into the css.
I tried that and it didnt work. If this is infact the correct way to get rid of it, where exactly in the css should i put it?
http://www.rsicorp.org/rsi/silvagilroy.html
Any suggestions are appreciated!
Thanks

Any suggestions are appreciated!
Start by fixing your code errors.
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.rsicorp.org%2Frsi%2Fsilvagilr oy.html
You have 2 Spry menu systems on your site. If you want this applied to all links, put this anywhere in your layout.css file.
a {outline:none}
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

Unwanted colored box around link

Who can help me to get rid of the coloured line/rectangle
that appears around my image the moment I make that image a link?
In CSS the link appearances are not specified, in the page
properties neither.
I think I have to 'overrule' the settings somewhere (I.E.?)
but cannot find it.
Also, does someone know if it is possible to change these
links-appearance-settings just for a certain layer?
THANKS!

Yes. I counted. 12 times already.
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
==================
"Michael Fesser" <[email protected]> wrote in message
news:[email protected]..
> .oO(E Michael Brandt)
>
>>a {text-decoration:none}
>
> I think it's
>
> a img {border: 0}
>
> Didn't we have this question today already? ;)
>
> Micha

Areas of blue across half of the screen and blue boxes around apps. whats happening?

Hello. I have an Iphone 5s. and I am getting areas of Blue on my screen and apps Highlighted in blue.
Please can anybody help?

Sadly your iPad screen and/or backlight is going bad from what you explain... Taking it to Apple will be an option... you need to see what their diagnotics test reveal... either faulty backlight or screen or both... that will determine cost to repair... they will give options prior to you having to decide on what you want to spend...

How do you remove link box around images?

I have put a link on a firework image that I created. When I put the files up it looks fine on my computer but a blue box keeps showing up on older computers. It is a bright blue color and looks very weird. Is there a way to have a link on the image but without a blue box around it? Or at least change the color of the link so it matches the site. Thanks!

'In the stylesheet add the following: (or in the head of the document if that's where your style rules are).
a img {border: none}
This will ensure there is no border on *any* images that have links attached to them.
Nadia
Adobe Community Expert : Dreamweaver
Unique CSS Templates | Tutorials | SEO Articles
http://www.DreamweaverResources.com
Web Design & Development
http://www.perrelink.com.au
http://twitter.com/nadiap

Blue box around linked picture

Similar Messages

Maybe you are looking for