Google Sign in options
Remember me
This is not recommended for shared computers

Privacy Policy
Sign In
Create Account

Javascript Disabled Detected

You currently have javascript disabled. Several functions may not work. Please re-enable javascript to access full functionality.

Subscribe to HRA Now!

SEO Class in Chicago, IL

Learn How To Optimize Your Website on July 26, 2013

Looking for personalized in-depth SEO training among your peers?

High Rankings is offering a 1-day customized SEO training class in Chicago. Class size is limited so please sign-up now if you want in!

Are you a Google Analytics enthusiast?

Share and download Custom Google Analytics Reports, dashboards and advanced segments--for FREE!

www.CustomReportSharing.com

From the folks who brought you High Rankings!

Proper Image Linking Code For Css

Started by Hans G. , Oct 01 2007 05:37 PM

Please log in to reply

6 replies to this topic

#1 Hans G.

HR 3

Members
99 posts

Posted 01 October 2007 - 05:37 PM

Hi, all. I need help with what I'm sure will be an easy task for most of you here. I'm new to CSS and I've got the following code working beautifully and now I need to make the image I specify below linkable. In short, I need myurl.com/image.jpg to link to myurl.com/index.htm. What is the extra piece of code that I need to add?

Above the </head>, I have:

CODE

and below the <body>, I have:

CODE

Back to top

#2 Randy

Convert Me!

Moderator
17,540 posts

Posted 01 October 2007 - 08:45 PM

It's not a function of CSS. Simply create the link via HTML.

CODE

You'll probably want to add a border="0" to your img tag so that no outline is created around the linked image. And personally I'd link just to the base domain name and leave out the index.htm part.

Back to top

#3 Hans G.

HR 3

Members
99 posts

Posted 02 October 2007 - 02:46 PM

Worked like a charm. Thanks!

Back to top

#4 JohneeMac

HR 4

Active Members
217 posts

Location:Scotland

Posted 04 October 2007 - 07:29 AM

QUOTE(Randy @ Oct 2 2007, 02:45 AM)

add a border="0" to your img tag

Depending on validators that may be invalid.

Much better to use css to hide the border:

At the start of stylesheets i have

QUOTE

*{ border:0;
margin:0;
}

img{border:0;
}

Although some people use a different CSS reset method but it involves a little more code.

Back to top

#5 Jill

High Rankings Advisor

Admin
32,375 posts

Posted 04 October 2007 - 11:35 AM

Offtopic

Has anyone EVER used the image border since 1993 or so?

Why is it still a default? Who makes up these rules?

Back to top

#6 qwerty

HR 10

Moderator
8,317 posts

Location:Somerville, MA

Posted 04 October 2007 - 12:31 PM

Never. I might apply a shadow, but that becomes part of the image, and you certainly don't want to wrap a shadow in a border

Going back to the image that's anchoring a link: keep in mind that if you've got some effect like a background color set up for the hover pseudoclass of your links, it will apply to images that are links as well, so you may need to set up a class of anchor like a.img that you can define as having no background.

Back to top

#7 Tom Philo

Photographer

Active Members
507 posts

Location:Beaverton, Oregon

Posted 09 October 2007 - 05:16 PM

QUOTE(Jill @ Oct 4 2007, 09:35 AM)

Offtopic

Has anyone EVER used the image border since 1993 or so?

Why is it still a default? Who makes up these rules?

I always use an image border - since my site is heavy with images (and sell prints of them if people want them) so I use 100x100 pixel versions on pages so that people know to click on them to see a larger image.

I sometimes will put just an image on there with no larger version - this way people know NOT to click on it based on past experience on the site. No border no clickie.