...

View Full Version : boardered image that is linked: removing unwanted border



tspek
10-27-2009, 09:32 PM
I've got images on a site i'm working on that i've created a border around to allow some separation from content and I also use it as a way to caption the photos. Many of the photos on the site are linked to other photo's or other pages.

In IE, both borders are showing up, and I can't seem to figure out how to not get that to happen...

css

.imgfloatright { border:solid 1px #999; float:right;
width:325px; padding-bottom:2px; text-align:center;
color:#666; font-size:small; margin-left:5px;}

HTML

<span class="imgfloatright"><a href="carbon-wheels.html">
<img src="images/carbon-tubulars.jpg" alt="PSIMET Custom Carbon Fiber
50mm deep tubular wheelset" /></a><br />
PSIMET's Custom 50mm Deep Carbon Clincher wheelset</span>

Rowsdower!
10-27-2009, 11:06 PM
Try this:
.imgfloatright a {border:0;}

tspek
10-28-2009, 01:33 AM
Try this:
.imgfloatright a {border:0;}

That doesn't seem to do it.

I've tried getting at what you are getting at, i presumed my syntax was wrong.

jolly_nikki
10-28-2009, 01:43 AM
I've got images on a site i'm working on that i've created a border around to allow some separation from content and I also use it as a way to caption the photos.

In IE, both borders are showing up, and I can't seem to figure out how to not get that to happen...


The above two statements are contradicting. first statement says, you added a border to separate the image from contents and second one says you don't want a border.

tspek
10-28-2009, 03:20 AM
The above two statements are contradicting. first statement says, you added a border to separate the image from contents and second one says you don't want a border.

Right, thus the dilemma.

The other thing I tried was to simply add the rules for .imgfloatright to a linked image. Maybe I had the syntax wrong though?

if .imgfloatright = a.imgfloatright wouldn't that give me what I want? Or would it look like something else?

Rowsdower!
10-28-2009, 01:58 PM
Well with the code snippets we've seen my CSS should have done the trick. If it didn't work then the problem could be conflicting CSS, a missing or incorrect DTD, or any number of other things.

Can we have a link to the live test page?

tspek
10-28-2009, 04:14 PM
www.psimet.com

Rowsdower!
10-28-2009, 05:22 PM
I'm seeing the same border appearances between FF3 and IE7 so I'm not sure if I'm solving the right issue, but how about this:
.imgfloatright a img {border:0;}

Rowsdower!
10-28-2009, 05:27 PM
Right, thus the dilemma.

The other thing I tried was to simply add the rules for .imgfloatright to a linked image. Maybe I had the syntax wrong though?

if .imgfloatright = a.imgfloatright wouldn't that give me what I want? Or would it look like something else?

Yep, the syntax is wrong there for what you were trying. The "a.imgfloatright" would be for link <a> tag which actually had the class of "imgfloatright" which yours does not have (as far as I can see). So this part of your CSS:

a.imgfloatright, a.imgfloatright:link, a.imgfloatright:visited, a.imgfloatright:active {border:solid 1px #999;}

That particular style rule should have no bearing on anything in your page at all.

tspek
11-02-2009, 03:54 AM
I'm seeing the same border appearances between FF3 and IE7 so I'm not sure if I'm solving the right issue, but how about this:
.imgfloatright a img {border:0;}

That's what we're looking for.

Thanks.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum