Get rid of blue borders around images in links

When you use an image as a link, a blue border surrounds the image like this:
This is because since Dreamweaver CS3, Dreamweaver no longer inserts border="0" in the image (<img>) tag. Although some people will tell you to set the image border to zero in the Property inspector, this is NOT the correct way to do it. Use CSS instead.
Create the following style rule, either in a <style> block in the <head> of the page, or preferably in an external style sheet:
a img { border: none; }
This automatically removes the blue border from ALL images that are used as links. If you use an external style sheet, and link it to all the pages in your site, the same rule affects every image link in your site. This is much more efficient than adding zero to the border property in each individual image.

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.

Similar Messages

Need to get rid of blue line under image

Hi,
I've created a table with a row and three columns also I've placed splitted a button into three pieces and placed left portion in 1st column and right portion in last column and I've placed a piece of background image with repeat-x in middle column. I need to link the button used javascript to rollover the button with another three piece of buttons, so I've linked the whole with <a> tag and given "border=0" for <img> tag, now I get a blue bar (seems linked) under the background images that I've used in the middle column, could you please help me to get rid of the blue line.
Thanks in advance

Hi Nancy,
Thanks for the response. Below is my code. What I exactly need is to link the whlole button instead of only the text "Buy Now". The mean time I dont want to use <img src="" border=0"> for the middle column since the text "Buy Now" should be dynamic and can be changed, so that I've used a background image instead of a <img> tag.
<div id="subdiv6">
                    
                        <a href="javascript:void(0)" onmouseover="ShiftTo('subdiv7')">
                            <table width="100" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                    <td align="left" valign="top"><img src="images/butoverl.png" border="0" width="16" height="45" /></td>
                    <td align="center" valign="middle" background="images/butovermid.png" class="proddemo">BUY NOW</td>
                    <td align="left" valign="top"><img src="images/butoverr.png" border="0" width="16" height="45" /></td>
                  </tr>
                </table>
                        </a>
                    
                </div>
                <div id="subdiv7">
                    
                        <a href="javascript:void(0)" onmouseout="ShiftTo('subdiv6')">
                            <table width="100" border="0" cellspacing="0" cellpadding="0">
                  <tr>
                    <td align="left" valign="top"><img src="images/butl.png" border="0" width="16" height="45" /></td>
                    <td align="center" valign="middle" background="images/butmid.png" class="proddemo">BUY NOW</td>
                    <td align="left" valign="top"><img src="images/butr.png" border="0" width="16" height="45" /></td>
                  </tr>
                </table>
                        </a>
                    
                </div>

Get rid of white box around image after image tracing to create vectors

Hi there, please help!!!
I am trying to convert png and psd images (icons) into vectors but i would like to safe them as .eps file and keep them on a transperent background. How do i do that? After the image tracing a white box appears around my images and i dont know how to get rid of it.
I would be so greatful if someone could help me out here as i tried suggestion from the internet and nothing worked so far.
Thank you so much,
Franzi

Franziska,
Tick Ignore White in the Image Trace options.

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.

Can't get rid of white border around image

http://www.gunnar.ca/laminatepage2.htm
I created a rounded corner in photoshop for my table. I
created a cell in the bottom left corner of the table and placed
the gif. There is a thin whit border around the outer edge of the
gif, so it doesn't look genuinely rounded. Can anyone tell me how
to get rid of that so it looks like the table is actually rounded?
Thank you!

Because the table containing the GIF has a border. In your
styleA.css
stylesheet, the rule:
.border {
border: 1px solid #E5E5E5;
adds a border to the table. Delete the rule. Of course - that
may affect
other things that use the .border class. Or - delete the
class from the
table tag.
Several problems with the page:
styles.css cannot be found
sideNavStyles.css cannot be found
34 vaildation errors:
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.gunnar.ca%2Flaminatepage2.htm
Alec
Adobe Community Expert

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

Getting rid of black borders from video

is there a bleed line with this software because I do "scale to frame size"

There's no such thing as bleed in video. Your source video is at a different aspect ratio than your sequence; what are the dimensions of your footage and of your sequence?
Scale to Frame Size works by scaling the video in a sequence frame until it is able to show the entire video image; if it hits a boundary (sides or top and bottom) before completely filling the frame, it will stop scaling. It won't ever stretch, squeeze, or otherwise distort the video image. In cases like that--if your source footage and sequence are different aspect ratios--you're better off using the intrinisic (that is, built-in to every clip) Motion > Scale effect. Select the clip, bring the Effects Controls panel forward, and swivel open the Motion effect; drag the Scale parameter up or down until you fill the frame and eliminate the black bars.
Check out this video for more: How do I get rid of black bars around my movie? - Premiere Pro: Frequently Asked Questions

Getting rid of a box around text in adobe acrobat pro

How can I get rid of the box around the 2 items capital outline and capital case cites

I don't see properties when I right-click with the box selected. Is there another way to hide this? Thanks

Need to get rid of flicker in between image displays--the PC in which LabVIEW 8.2 is installed is routing images via LaVIEW code & 'extended desktop' to typical visual projector and between each image display is a flicker--that we need to remove

Need to get rid of flicker in between image displays--the PC on which LabVIEW 8.2 is installed is routing images via LabVIEW code & 'extended desktop' to a typical visual projector and between each image display is a flicker--that we need to remove
Attachments:
Get JPEG Files in the folder.vi ‏13 KB
Display image on the screen.vi ‏34 KB
Create image file path.vi ‏12 KB

In response to below------Thank you Lynn-----Yes, there is a main panel--I will attach----and if you have any further suggestions please let me know--Thanks again
How are you running this program? Is there a top level vi which calls the ones you posted? The Display image on screen.vi will display two images in succession, but according to the note on the block diagram the second image is blank. It seems as though this would intentionally create a flicker.
The sequence structure is unnecessary. Dataflow will determine the order of execution. The only exception is the time delay in the third frame. Since it has no data dependency, a single frame sequence may be useful to assure that the delay occurs before the picture is updated. A simple state machine might be a more versatile architecture for what you may be trying to do.
It is not necessary to write the FR.PanelBounds property immediately after reading it, nor is it necessary to read it a second time in the second frame. Just wire from the first read.
Lynn
Attachments:
Main Front Panel with Rendv Final Nov 6 with pause.vi ‏755 KB

HT2905 How do I automatically get rid of iTunes titles that don't link to any file? I have many duplicates and only 1 that "works"

How do I automatically get rid of iTunes titles that are not "linked" to any file. I have multiple listings and only 1 or 2 that "work" for many songs...?

Once an item enters the download queue, the user cannot remove it. If you can't get it downloaded, contact the iTunes Store customer support department through the form linked from the bottom of their Download FAQ web page and ask them if they'll remove the item from your queue for you.

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.

I want to get rid of blue link-highlight

How do I avoid getting the blue highlight around linked images and text? Thank You

a img { border: 0; }
in the stylesheet shud remove the border frome the image links ...
I do have an old GL action for removing links borders ... you can get it here http://www.jart.dk/jgom/golive/golive-actions/removelinkbox.html

Getting rid of white border around photos when using iphoto to iweb

Hi there,
Am creating web pages in iweb and importing photos from iphoto. Can anyone tell me how to get rid of the white border around my photos (image frame)? Hoping to enhance some of the templates with my own images. I also have photoshop elements and have been having the same problem there. Sure appreciate. Kim Strouble

Welcome to the Apple Discussions. The link to the site is broken. There is a fix for some of the strange goings on since the MobileMe conversion. See Wyodor's post in this thread: http://discussions.apple.com/thread.jspa?threadID=1605665&tstart=0. After applying the fix to iWeb I found I might have to republish a second time, occasionally a third and make sure I cleared my browser's cache.
If you're using Firefox 3 that's a different solution that can be found here: http://discussions.apple.com/message.jspa?messageID=7486799#7486799
TIP: For insurance against the iPhoto database corruption that many users have experienced I recommend making a backup copy of the Library6.iPhoto (iPhoto.Library for iPhoto 5 and earlier) database file and keep it current. If problems crop up where iPhoto suddenly can't see any photos or thinks there are no photos in the library, replacing the working Library6.iPhoto file with the backup will often get the library back. By keeping it current I mean backup after each import and/or any serious editing or work on books, slideshows, calendars, cards, etc. That insures that if a problem pops up and you do need to replace the database file, you'll retain all those efforts. It doesn't take long to make the backup and it's good insurance.
I've created an Automator workflow application (requires Tiger or later), iPhoto dB File Backup, that will copy the selected Library6.iPhoto file from your iPhoto Library folder to the Pictures folder, replacing any previous version of it. It's compatible with iPhoto 6 and 7 libraries and Tiger and Leopard. iPhoto does not have to be closed to run the application, just idle. You can download it at Toad's Cellar. Be sure to read the Read Me pdf file.
Note: There now an Automator backup application for iPhoto 5 that will work with Tiger or Leopard.

How do I get rid of various lines around text boxes when using navigation panes

How can I get rid of these various lines that are displaying sporatically around different text boxes . . . but only when the navigation panel is displaying? I previously had the issue and changed the text box properties to no fill. It fixed the problem in the document with no navigation panel, but once the navigation panel is displayed the lines appear. And yes, I fixed the text box properties before creating the bookmarks for the navigation panel.

Every device, browser and browser version has its idiosyncrasies.
Just using a stroke and a drop shadow should not have been enough to require Muse to convert the page fill to an image. Were/are there also other effects on the page? Are the page corners slightly rounded?
Bevel and Inner Glow definitely require an image to be created. Most other effects/properties do not.

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

Get rid of blue borders around images in links

Similar Messages

Maybe you are looking for