473,386 Members | 1,819 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,386 software developers and data experts.

Hyperlinked image border in Opera

The following code renders a visible border around the hyperlinked image
using the UA's default colours for links in IE and Moz:

a img{border-width:1px}

<a href="foobar.html"><img src="foobar.jpg" alt="foobar"></a>

but not in Opera.

I imagine that border colour normally defaults to transparent, but
shouldn't that be replaced by the default colours for links if the image
is hyperlinked?
Headless

--
Email and usenet filter list: http://www.headless.dna.ie/usenet.htm
Jul 20 '05 #1
5 6245
Headless wrote:
The following code renders a visible border around the hyperlinked image
using the UA's default colours for links in IE and Moz:

a img{border-width:1px}

<a href="foobar.html"><img src="foobar.jpg" alt="foobar"></a>

but not in Opera.
The initial value of the 'border-style' properties are 'none'. You need to
change this to 'solid', otherwise "the computed value of border-width is
forced to 0."

Is Mozilla in standards mode when this happens? It sounds like a bug.

I imagine that border colour normally defaults to transparent,
The initial values of the border-color properties default to the 'color'
property's value.

<URL:http://www.w3.org/TR/REC-CSS2/box.html#propdef-border-color>

In any case, you can check for transparent borders by setting the
border-width to something stupidly big, like 10em.

but shouldn't that be replaced by the default colours for links if the
image is hyperlinked?


Not necessarily, at least according to the CSS 2 specification. Whether it
makes sense for user-agents to do this is another matter, I would say that
it does.

The initial value will be the color property of the image.
<URL:http://www.w3.org/TR/REC-CSS2/colors.html#colors> says that the
initial value for the 'color' property "depends on [the] user-agent".

I would suggest adding the following rule:

a img {
color: inherit;
}

(a used instead of :link, :visited for browser compatibility, this is only
significant in corner cases, I think.)
--
Jim Dabell

Jul 20 '05 #2
Jim Dabell wrote:
The initial value of the 'border-style' properties are 'none'. You need to
change this to 'solid', otherwise "the computed value of border-width is
forced to 0."
Bingo.
Is Mozilla in standards mode when this happens?


Definitely.
but shouldn't that be replaced by the default colours for links if the
image is hyperlinked?


I would suggest adding the following rule:

a img {
color: inherit;
}


Added (only I changed it to border-color :)

Thanks,
Headless

--
Email and usenet filter list: http://www.headless.dna.ie/usenet.htm
Jul 20 '05 #3
Headless wrote:
Jim Dabell wrote:

[snip]
Is Mozilla in standards mode when this happens?


Definitely.


Well I guess you can get around calling it a bug by saying that the
user-agent stylesheet has the rule:

:link img,
:visited img {
border-style: solid;
border-width: 2px;
}

I guess the defined initial values in the specifications aren't worth much.

but shouldn't that be replaced by the default colours for links if the
image is hyperlinked?


I would suggest adding the following rule:

a img {
color: inherit;
}


Added (only I changed it to border-color :)


That wasn't a typo/thinko, but your version is probably more reliable :)
--
Jim Dabell

Jul 20 '05 #4
Jim Dabell wrote:
but shouldn't that be replaced by the default colours for links if the
image is hyperlinked?

I would suggest adding the following rule:

a img {
color: inherit;
}


Added (only I changed it to border-color :)


That wasn't a typo/thinko, but your version is probably more reliable :)


Yes on reflection this is a bit of a funny one. I suppose it can be said
that the hyperlink element itself does not render, but rather that it
manipulates the hyperlinked content to make it recognizable as a link.
In the case of inline content such as text the colour of the content
itself is changed, in the case of replaced inline content like images a
border is applied around the image.

The question then is; does <a> have a color/border-color that can be
inherited by descendant elements, and does it depend on what is being
hyperlinked?
Headless

--
Email and usenet filter list: http://www.headless.dna.ie/usenet.htm
Jul 20 '05 #5
Headless wrote:
Jim Dabell wrote: [snip] The question then is; does <a> have a color/border-color that can be
inherited by descendant elements, and does it depend on what is being
hyperlinked?


On my reading of the spec:

It doesn't have a border (the initial value of border-style is none,
according to the spec).

Browsers typically include default styles that set the 'color' property,
although this isn't in the spec.

:link { color: blue; }
:visited { color: purple; }
:active { color: red; }

According to the spec, its children, unless they explicitly specify a value,
will inherit the value of the 'color' property.

Unless they explicitly specify a value, they will use the value of their
'color' property for border colours as well.

I can't think of any situation in any browser where this doesn't work like
this, or where the contents matter. Your Opera bug can be explained away
by not setting the border style. In every other visual browser I can think
of, a default border-style is set for elements that can be selected with
:link img, :visited img (and I thought Opera did this as well). There's no
need to suggest anything relating to borders for link elements, the 'color'
property inheritance does the work.
--
Jim Dabell

Jul 20 '05 #6

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: Albert Wagner | last post by:
Javascript doesn't allow a hyphen in names, therefore when creating an image element in javascript and wanting to specify 'z-index', I had to spell it 'zindex'(image.style.zindex = 10;). But I am...
6
by: Robert Lapes | last post by:
I'm just getting into using CSS and I'm having a problem getting Opera to display a Navigation Bar in the same way as IE6. Can someone please point me in the right direction? The site I'm...
3
by: Jay | last post by:
I need help!! I'm using IE 6 and look at the bottom-left corner of the image border: http://pages.infinit.net/jaylac/image.html It does that when i use border="1" or any css border style. I...
4
by: Erik Sandblom | last post by:
Hello all, I made a nice frame around an image, using padding and border like this: <img style="padding: 5px; margin: 5px; border: 1px solid gray" src="./stuff/gde.gif" alt="Gewerkschaft der...
8
by: Chuck | last post by:
given that the img border >0, how is a border color specified? Chuck
2
by: Stephen | last post by:
Ever since I ported VB my webform to C# the images in the following html have borders. <asp:EditCommandColumn footerText="New Item" EditText="<img src=images/edit.gif (border=0 alt='Edit line...
7
by: roN | last post by:
Hi, I have an image and I would like to draw a border around it, I tried: <p style="border:1px border-style:solid; border-color:#EEEEEE; background-color:#FFFFFF;"><img src="./images/header.jpg"...
4
by: Gary | last post by:
Hello, I want a background image to display in the extreme bottom right corner. What I have works fine in IE7 and FF2 not so in Opera 9.1 Any suggestions? Page Posted at the the link. ...
0
by: shapper | last post by:
Hello, Can I apply a top and bottom border to a fieldset but using an image to define a custom border line? How can I do this? Thank You, Miguel
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.