Re: [css-d] [media queries] support for *-device-pixel-ratio

2011-11-29 Thread Philippe Wittenbergh

On Nov 30, 2011, at 6:16 AM, Joergen W. Lang wrote:

>>> Is this query supported? Will it be supported in the future? Is its
>>> usage recommended?
> 
> were referring to support/endorsement by any official specification or 
> recommendation. Did I miss something?
> 
> Yet, if anybody out there knows more, I'd appreciate your answer.

As far as I can tell, those queries are not yet part of any official document. 
Presumably it will go into a future css4-mediaqueries module (I see no reason 
why it wouldn't happen, given extensive prefixed browsers support, but my 
crystal ball is rather cloudy and I can't see the future :-( )

Note that Opera – as of 10.5 –  uses a slightly different value that 
Gecko/WebKit:
> @media screen and (min--moz-device-pixel-ratio: 1.5),
> screen and (-webkit-min-device-pixel-ratio:1.5),
> only screen and (-o-min-device-pixel-ratio: 3/2)

Philippe
--
Philippe Wittenbergh
http://l-c-n.com/






__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Border: Double

2011-11-29 Thread Philippe Wittenbergh

On Nov 30, 2011, at 5:07 AM, Mark Richards wrote:

> According to http://my.opera.com/community/forums/topic.dml?id=264982 This
> is by design, they assume that this is what the spec wanted, even though
> they seem to be completely alone in this regard, and as far as I'm
> concerned, this behaviour is useless.

Seems to me that Opera has a completely different reading of Appendix E than 
everybody else. At least as far as the level where outline is painted (and I 
think the wording of said appendix E changed slightly since that forum thread 
–2009– to make clear what should happen).

Iirc, old geckos had a similar bug, Firefox 2.0 or thereabout ?

Philippe
--
Philippe Wittenbergh
http://l-c-n.com/






__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] [media queries] support for *-device-pixel-ratio

2011-11-29 Thread Joergen W. Lang

Am 29.11.11 17:11, schrieb David Laakso:


On 11/29/11 8:58 AM, Joergen W. Lang wrote:



looking into the possibilities of CSS media queries I found several
 sources that recommend using /min-device-pixel-ratio/ (and
friends) to check for high-resolution screens. Apparently this is
implemented in the form of several prefixed versions in webkit,
Opera and Gecko.



[...] I don't think there is a definitive answer to your question,
other than that-- "it depends."


Oh, sorry. Let me rephrase. My initial questions


Is this query supported? Will it be supported in the future? Is its
usage recommended?


were referring to support/endorsement by any official specification or 
recommendation. Did I miss something?


Yet, if anybody out there knows more, I'd appreciate your answer.

Jørgen Lang

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] using image in background of h1 heading

2011-11-29 Thread Jukka K. Korpela

2011-11-29 22:04, Angela French wrote:


I am trying to make an image as a background on an h1.
Here is my test page: http://sbctc.edu/college/_i-ctclinkTEST.aspx .

It works fine, but is there some way to make the text display if images are off?


I'm afraid there isn't:
"Most image replacement techniques suffer from serious accessibility 
problems for users who turn images off [...] but CSS on."

  http://css-discuss.incutio.com/wiki/Image_Replacement

Is there any reason not to use the simple method, which does not need 
CSS at all but may be augmented with it:




You would then probably want to set

h1 { margin: 0; }
h1 img { vertical-align: bottom; }

to remove the default margins and the effect of the image sitting on the 
baseline of text; they could disturb the layout when the image is used 
(normal case).


You could additionally have font and color settings, which would mostly 
have no effect on the image but would style the text (on good browsers 
at least) when the alt text is used instead.


However, font size would affect the height, so it would probably be best 
to set the h1 element's line-height to the height of the image, e.g.


h1 img { line-height: 32px; }

This means that the font size should be something that probably sits 
well for that line-height. This could even be one of the rare cases 
where they are good reasons to set the font size in pixels in an author 
(page) stylesheet.


This approach also means that when the page is printed, the heading is 
included, as an image (when images are on) or as (styled) text. Image 
replacement techniques may fail on printing: the heading isn't there at 
all, as an image or as text.


Yucca

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Border: Double

2011-11-29 Thread Mark Richards
On Tue, Nov 29, 2011 at 11:14, Paceaux  wrote:

> Is this a known defect/bug in Opera?
>
> I can't imagine a scenario where I'd intentionally apply an outline to an
> invisible element. But,  I can see this as a good bit of information where
> we've gotten our selectors wrong, or some sort of JavaScript was applied
> incorrectly - and we see a box on our page for no good reason. I use
> outline for doing wireframes, so this is good to know.
>
> My guess is that this happens because outline is not supposed to be part
> of the layout - unlike border. I think I read in Meyer's book Smashing CSS
> that the outline is meant to be drawn around the element. So it looks like
> Opera maybe is following the letter of the law, while the other browsers
> are assuming you don't want to outline what's invisible.
>

According to http://my.opera.com/community/forums/topic.dml?id=264982 This
is by design, they assume that this is what the spec wanted, even though
they seem to be completely alone in this regard, and as far as I'm
concerned, this behaviour is useless.

Mark
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] using image in background of h1 heading

2011-11-29 Thread Angela French
Hello,
I am trying to make an image as a background on an h1.  Here is my test page: 
http://sbctc.edu/college/_i-ctclinkTEST.aspx .

It works fine, but is there some way to make the text display if images are 
off?  Right now it is positioned off the page.   I wish there c

Here is the css:

h1.headerReplacement {
text-indent: -px;
width: 135px;
height: 40px;
background: url('/imgs/it/ctcLink.jpg') no-repeat;
}

Angela French
Internet Specialist
State Board for Community and Technical Colleges
360-704-4316
afre...@sbctc.edu
http://www.checkoutacollege.com/

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] CSS WAS NOT Being Picked Up By Most Browsers

2011-11-29 Thread Elli Vizcaino


> 2011-11-29 19:39, Elli Vizcaino wrote:
> 
>>>  In practice it is best to omit the type attribute, since it serves no 
> useful
>>>  purpose but can cause harm if misspelled.
>>> 
>>  Thanks! I thought the type attribute was required.
> 
> It's required in HTML 4. In HTML5 drafts, it isn't.
> 
>>  So w/o it, a document will still validate and be interpreted as it should 
> be?
> 
> Browsers treat the content as a CSS stylesheet, yes. No, the HTML markup 
> won't validate, unless you're using HTML5.
> 
> Yucca

Got it. Thanks!

Elli 

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] CSS WAS NOT Being Picked Up By Most Browsers

2011-11-29 Thread Jukka K. Korpela

2011-11-29 19:39, Elli Vizcaino wrote:


In practice it is best to omit the type attribute, since it serves no useful
purpose but can cause harm if misspelled.


Thanks! I thought the type attribute was required.


It's required in HTML 4. In HTML5 drafts, it isn't.


So w/o it, a document will still validate and be interpreted as it should be?


Browsers treat the content as a CSS stylesheet, yes. No, the HTML markup 
won't validate, unless you're using HTML5.


Yucca
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] CSS WAS NOT Being Picked Up By Most Browsers

2011-11-29 Thread Elli Vizcaino


> In practice it is best to omit the type attribute, since it serves no useful 
> purpose but can cause harm if misspelled.
> 
Thanks! I thought the type attribute was required. So w/o it, a document will 
still validate and be interpreted as it should be? 


 
Elli Vizcaino
Helping artists, entrepreneurs and 
small businesses look like rock stars &
knock the socks off the competition!
http://www.e7flux.com

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] CSS WAS NOT Being Picked Up By Most Browsers

2011-11-29 Thread Jukka K. Korpela

2011-11-29 19:07, Elli Vizcaino wrote:


Just started building out a new site I'm working on and

> I just figured out why there were only 2 browsers picking up
> the CSS, Safari &  Chrome, while the rest didn't and yet

both my CSS and document validated. I had text/javascript

> under the type attribute of my link tags.

If a browser interprets the content as CSS, then that's a bug. The 
purpose of the type attribute in  is to specify 
the stylesheet language. It is in practice defaulted to CSS, and CSS is 
for most purposes the only stylesheet language that can be used for HTML 
documents. But if you do specify the attribute, then the browser is 
required to interpret the content according to it. And since JavaScript 
is not a stylesheet language, the contents should be ignored.


In practice it is best to omit the type attribute, since it serves no 
useful purpose but can cause harm if misspelled.


Markup validators in the old (SGML) sense of the word only verify 
compliance to a formalized syntax. For the type attribute, this 
basically means "anything goes". In HTML5 validation, the attribute 
value is checked to be a correctly formed Internet media type, such as 
foo/bar, but it does not even check that the type is a registered one, 
still less that denotes (for example) a stylesheet.


Yucca
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] CSS WAS NOT Being Picked Up By Most Browsers

2011-11-29 Thread Elli Vizcaino
Hi Everyone, 


Just started building out a new site I'm working on and I just figured out why 
there were only 2 browsers picking up the CSS, Safari & Chrome, while the rest 
didn't and yet both my CSS and document validated. I had text/javascript under 
the type attribute of my link tags. It has since been corrected but I'm left 
wondering why the document actually validated as well written mark up? 



Elli Vizcaino
Helping artists, entrepreneurs and 
small businesses look like rock stars &
knock the socks off the competition!
http://www.e7flux.com
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Border: Double

2011-11-29 Thread Paceaux
Thanks, Mark!

Is this a known defect/bug in Opera?

I can't imagine a scenario where I'd intentionally apply an outline to an 
invisible element. But,  I can see this as a good bit of information where 
we've gotten our selectors wrong, or some sort of JavaScript was applied 
incorrectly - and we see a box on our page for no good reason. I use outline 
for doing wireframes, so this is good to know. 

My guess is that this happens because outline is not supposed to be part of the 
layout - unlike border. I think I read in Meyer's book Smashing CSS that the 
outline is meant to be drawn around the element. So it looks like Opera maybe 
is following the letter of the law, while the other browsers are assuming you 
don't want to outline what's invisible. 





Frank M Taylor 
http://frankmtaylor.com
@paceaux


On Nov 29, 2011, at 6:42 AM, Mark Richards wrote:

> On Mon, Nov 28, 2011 at 17:36, Paceaux  wrote:
> 
>> There's another CSS3 trick you can try, but I don't think it has as wide
>> support as the box-shadow trick. You *do* add border and outline, and then
>> apply outline-offset:
>> 
>> border: 1px solid #444;
>> outline: 3px solid #444;
>> outline-offset: 3px;
>> 
> 
> Just a word of warning to anyone using outline and Opera: Opera renders the
> outline on top of everything, even if it would normally be invisible.  This
> makes outline useless to anyone with a complex layout who cares about Opera
> support.
> 
> Sample:
> 
> 
>#a, #b {
>  height: 100px;
>  width: 100px;
>  position: absolute;
>  border: 1px solid green;
>}
>#b {
>  border: 1px inset red;
>  background-color: blue;
>}
>#aa {
>  margin: 30px auto;
>  height: 40px;
>  width: 40px;
>  background-color: pink;
>  outline: 1px solid pink;
>}
>
>  
>  
>
>
>  
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] [media queries] support for *-device-pixel-ratio

2011-11-29 Thread David Laakso

On 11/29/11 8:58 AM, Joergen W. Lang wrote:


looking into the possibilities of CSS media queries I found several 
sources that recommend using
/min-device-pixel-ratio/ (and friends) to check for high-resolution 
screens. Apparently this is implemented in the form of several 
prefixed versions in webkit, Opera and Gecko.


Jørgen Lang

[1]: http://www.w3.org/TR/css3-mediaqueries/





Nothing beats putting up a page and trying stuff out and personally 
seeing if whatever works or not. It probably does work in some 
situations for some authors particularly those who dwell in the twilight 
zone of setting desktop and laptop content fonts at less or far less 
than default... the 10px, 11px, and 12px for primary content crowd, for 
example. Authors who may not be in that crowd may find that this will do 
the trick for desktop, laptop, tablets, and mobile handsets name="viewport" content="width=device-width">. I don't think there is a 
definitive answer to your question, other than that-- "it depends."


~d

--
Desktop. Laptop. Tablet. Mobile!
http://chelseacreekstudio.com/

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] unwanted borders around tags in IE8

2011-11-29 Thread Jukka K. Korpela

2011-11-29 14:00, dave higgs wrote:


Although I do use an external style sheet, the
suspect HTML code does not have any CSS applied to it so I am in the
wrong list!


The question was on-topic in the list as it was about a presentational 
feature, and although CSS did not create the problem, it can solve it.


(I guess people may have been confused because you mentioned the use of 
JavaScript and quoted a block of JavaScript code. That code does not 
relate to the question; it's functionality, not presentation, and the 
issue is exactly the same if JavaScript execution is disabled.)


Although the borders around an image that is a link _can_ be removed 
using HTML, too (using the attribute border=0 in each  tag), the 
CSS way (img { border: 0 }) is simpler and keeps the markup cleaner.


A completely different approach would be to replace the images by styled 
text, using a background image for the texts. The image would then be 
like the current images but without any text (and similarly for the 
hover version). There would be no image border issue then. There would 
be the issue of link colors and underline for the texts, but they can be 
handled easily in CSS.


Such a technique is usually better because it is more flexible. If you 
wish to change some of texts in the links or add a link, you wouldn't 
need to edit any images. And there is no alt text issue (now there is - 
your  tags are missing alt attributes). The drawback (if it is a 
drawback) is that you could only use such fonts that are supported by 
people's browsers (or use web fonts, @font face), and if users force 
their preferences on fonts sizes (which is what they _can_ do), the 
texts might run out of button-like image backgrounds.


Yucca
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] [media queries] support for *-device-pixel-ratio

2011-11-29 Thread Joergen W. Lang

Hello everybody,

looking into the possibilities of CSS media queries I found several 
sources that recommend using
/min-device-pixel-ratio/ (and friends) to check for high-resolution 
screens. Apparently this is implemented in the form of several prefixed 
versions in webkit, Opera and Gecko.


Alas, the "Media Queries" CSS3-spec [1] does not mention it.

Is this query supported? Will it be supported in the future? Is its 
usage recommended?


As always, pointers, hints, nudges in the right direction are very much 
appreciated.


Jørgen Lang

[1]: http://www.w3.org/TR/css3-mediaqueries/




__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] Border: Double

2011-11-29 Thread Mark Richards
On Mon, Nov 28, 2011 at 17:36, Paceaux  wrote:

> There's another CSS3 trick you can try, but I don't think it has as wide
> support as the box-shadow trick. You *do* add border and outline, and then
> apply outline-offset:
>
> border: 1px solid #444;
> outline: 3px solid #444;
> outline-offset: 3px;
>

Just a word of warning to anyone using outline and Opera: Opera renders the
outline on top of everything, even if it would normally be invisible.  This
makes outline useless to anyone with a complex layout who cares about Opera
support.

Sample:


#a, #b {
  height: 100px;
  width: 100px;
  position: absolute;
  border: 1px solid green;
}
#b {
  border: 1px inset red;
  background-color: blue;
}
#aa {
  margin: 30px auto;
  height: 40px;
  width: 40px;
  background-color: pink;
  outline: 1px solid pink;
}

  
  


  
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] unwanted borders around tags in IE8

2011-11-29 Thread dave higgs

Philip
oops, you are right.  Although I do use an external style sheet, the suspect 
HTML code does not have any CSS applied to it so I am in the wrong list! 
Thanks anyway for your kind reply.  I'll go and try and find an appropriate 
list

regards
Dave
- Original Message - 
From: "Philip TAYLOR" 

To: "dave higgs" 
Cc: 
Sent: Tuesday, November 29, 2011 10:34 AM
Subject: Re: [css-d] unwanted borders around  tags in IE8





dave higgs wrote:

Hi
On the six button menu at www.autobarn-cars.co.uk I see boxes around my 
links in IE8.  They are not there in Firefox or Chrome.  Each of the six 
buttons has the below javascript which does the rollover effect.  I am 
here showing the last two buttons, buttons 5 and 6
Button 6 has no javascript and no  tag because this particular code 
resides in the contact.htm page itself so I do not need to have button 6 
respond as it goes nowhere (we are already at the contact.htm page)


When I temporarily surround the img tag in button 6 with a  tag (just 
like button 5), the box appears which tells me the  tag is causing the 
box problem


I hope that explains the problem sufficiently as this is my first post

many thanks in advance for your advice


Well, where does one start ?  The real problem, as far as I can see,
is that whilst you are using JavaScript to accomplish the effects
for which you are aiming, there is no evidence at all from the
code that you have posted that you are also using CSS, and this
is a list that is intended to deal with CSS-related issues.  If
you are using CSS, and you can point us to it, then we may be able
to offer some help, but whilst I too have many questions related
to cross-browser compatibility using JavaScript, I do not believe
that this is the most appropriate forum in which to raise them

Philip Taylor 


__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] unwanted borders around tags in IE8

2011-11-29 Thread David Postill
On Tue, 29 Nov 2011 10:28:38 -, dave higgs wrote:

| Hi
| On the six button menu at www.autobarn-cars.co.uk I see boxes around my links 
in IE8.  They are not there in Firefox or Chrome.  Each of the six buttons has 
the below javascript which does the rollover effect.  I am here showing the 
last two buttons, buttons 5 and 6
| Button 6 has no javascript and no  tag because this particular code 
resides in the contact.htm page itself so I do not need to have button 6 
respond as it goes nowhere (we are already at the contact.htm page)



You also have a bunch of errors in your html:

http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.autobarn-cars.co.uk%2F
-- 
David Postill
Dance your Life - Biodanza in Holland - 
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] unwanted borders around tags in IE8

2011-11-29 Thread David Laakso

On 11/29/11 6:04 AM, Jukka K. Korpela wrote:

2011-11-29 12:28, dave higgs wrote:

> On the six button menu at www.autobarn-cars.co.uk I see boxes around 
my links in IE8.

> They are not there in Firefox or Chrome.

The reason is that browsers traditionally draw borders around images 
that are links or, more exactly, for any  element that is inside 
an  element that has an href attribute. Some browsers have 
abandoned the tradition.


To suggest that no such border be drawn, use

img { border: none; }

in your stylesheet.

Yucca

P.S. The tradition was based on the idea that users need to see that 
an image is a link from its appearance. The border color also reflects 
the state of the link (unvisited, visited, active, hovered). But 
authors did not like this idea in situations where they thought that 
it was obvious which images are links



Above +1.

You may want to fix your broken doctype.
~d










--
Desktop. Laptop. Tablet. Mobile!
http://chelseacreekstudio.com/

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] unwanted borders around tags in IE8

2011-11-29 Thread Jukka K. Korpela

2011-11-29 12:28, dave higgs wrote:

> On the six button menu at www.autobarn-cars.co.uk I see boxes around 
my links in IE8.

> They are not there in Firefox or Chrome.

The reason is that browsers traditionally draw borders around images 
that are links or, more exactly, for any  element that is inside an 
 element that has an href attribute. Some browsers have abandoned the 
tradition.


To suggest that no such border be drawn, use

img { border: none; }

in your stylesheet.

Yucca

P.S. The tradition was based on the idea that users need to see that an 
image is a link from its appearance. The border color also reflects the 
state of the link (unvisited, visited, active, hovered). But authors did 
not like this idea in situations where they thought that it was obvious 
which images are links

__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] unwanted borders around tags in IE8

2011-11-29 Thread Philip TAYLOR



dave higgs wrote:

Hi
On the six button menu at www.autobarn-cars.co.uk I see boxes around my links 
in IE8.  They are not there in Firefox or Chrome.  Each of the six buttons has 
the below javascript which does the rollover effect.  I am here showing the 
last two buttons, buttons 5 and 6
Button 6 has no javascript and no  tag because this particular code resides 
in the contact.htm page itself so I do not need to have button 6 respond as it goes 
nowhere (we are already at the contact.htm page)

When I temporarily surround the img tag in button 6 with a  tag (just like button 
5), the box appears which tells me the  tag is causing the box problem

I hope that explains the problem sufficiently as this is my first post

many thanks in advance for your advice


Well, where does one start ?  The real problem, as far as I can see,
is that whilst you are using JavaScript to accomplish the effects
for which you are aiming, there is no evidence at all from the
code that you have posted that you are also using CSS, and this
is a list that is intended to deal with CSS-related issues.  If
you are using CSS, and you can point us to it, then we may be able
to offer some help, but whilst I too have many questions related
to cross-browser compatibility using JavaScript, I do not believe
that this is the most appropriate forum in which to raise them

Philip Taylor
__
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/