Re: [WSG] Free Screen Readers

2007-01-13 Thread Mihael Zadravec

Hi!

Window Eyes is also available as a free trial - note again that it runs for
30 minuter per session. After that it requests that you reboot your system
and you can use it again and again

link http://www.gwmicro.com/Window-Eyes/Demo/

Mihael


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

[WSG] Shadows on a div?

2007-01-13 Thread Tom Roper

Hi everyone,

Just to say I'm a new member, and this is my first post, but I know  
people who have been using this for a while, and I know what a great  
bunch you all are!


The problem I've got a the minute is I've built a page for a client,  
but now she would like shadow on either side of the page, I know it  
would be possible to do it in photoshop/gimp, but the background  
image is quite complicated, so to 'cut out' the main section, and  
paste it back with shadow would mess up the look of the background  
image.


So I was wondering if anyone had any other ideas on what to do, or  
even if there is a bit of code that could be implemented?


The page is still in development, and is not live, but if you would  
like to view it, I have uploaded an image to my Flickr account, so  
you can see what I'm talking about. The URL is:


http://www.flickr.com/photos/tom_r07/355733167/

Thanks a lot, take care,

Tom Roper
[EMAIL PROTECTED]





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] Shadows on a div?

2007-01-13 Thread Mihael Zadravec

On 1/13/07, Tom Roper <[EMAIL PROTECTED]> wrote:


Hi everyone,
Just to say I'm a new member, and this is my first post, but I know people
who have been using this for a while, and I know what a great bunch you all
are!

The problem I've got a the minute is I've built a page for a client, but
now she would like shadow on either side of the page, I know it would be
possible to do it in photoshop/gimp, but the background image is quite
complicated, so to 'cut out' the main section, and paste it back with shadow
would mess up the look of the background image.

So I was wondering if anyone had any other ideas on what to do, or even if
there is a bit of code that could be implemented?

The page is still in development, and is not live, but if you would like
to view it, I have uploaded an image to my Flickr account, so you can see
what I'm talking about. The URL is:

http://www.flickr.com/photos/tom_r07/355733167/




Hi Tom!

One option would be a use of png image for shadows... but as they are not
supported by all browsers (like IE6 of corse..) that would not be the best
solution. If you decide to use this option, you could create eg. 2
stylesheets...  one for browsers that do not support png and one for those
which do support it. so.. you could ad like 20px padding to the wrapper and
ad a png background image to it.

You could also create one background image, that wuld be quite big in
width... something like 1700 px... that wuold contain middle space as wide
as the site is, with added shadows on both sides...

Mihael


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] Shadows on a div?

2007-01-13 Thread Christian Montoya

On 1/13/07, Mihael Zadravec <[EMAIL PROTECTED]> wrote:



On 1/13/07, Tom Roper <[EMAIL PROTECTED]> wrote:
>
> Hi everyone,

...

> The problem I've got a the minute is I've built a page for a client, but
now she would like shadow on either side of the page, I know it would be
possible to do it in photoshop/gimp, but the background image is quite
complicated, so to 'cut out' the main section, and paste it back with shadow
would mess up the look of the background image.
>
>
> So I was wondering if anyone had any other ideas on what to do, or even if
there is a bit of code that could be implemented?
>
>
> The page is still in development, and is not live, but if you would like
to view it, I have uploaded an image to my Flickr account, so you can see
what I'm talking about. The URL is:
>
>
> http://www.flickr.com/photos/tom_r07/355733167/


Hi Tom!

...

You could also create one background image, that wuld be quite big in
width... something like 1700 px... that wuold contain middle space as wide
as the site is, with added shadows on both sides...


Goodness, I hate it when people do that. A single huge background
image is a very heavy solution.

If you have the background pattern positioned like so:

background: color url(image) CENTER TOP;

or TOP CENTER, then the pattern starts from the top-middle just like
the content does. Then you have the same segment of the pattern on
both sides of the body content all the time. Then you just take a
screenshot of your page, cut out what shows of the pattern on both
sides and the bottom, add a gradient on top that is a "shadow," and
add those back in. On the sides you use repeat-y to tile it, and on
the bottom you use repeat-x.

It's a simple solution that doesn't require massive images or transparent PNGs.

And if that makes absolutely no sense to you, let me know and I'll try
to put together an example.

--
--
Christian Montoya
christianmontoya.net .. designtocss.com


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Shadows on a div?

2007-01-13 Thread Mihael Zadravec

On 1/13/07, Christian Montoya <[EMAIL PROTECTED]> wrote:


On 1/13/07, Mihael Zadravec <[EMAIL PROTECTED]> wrote:
>
>
> On 1/13/07, Tom Roper <[EMAIL PROTECTED]> wrote:
> >
> > Hi everyone,
...
> > The problem I've got a the minute is I've built a page for a client,
but
> now she would like shadow on either side of the page, I know it would be
> possible to do it in photoshop/gimp, but the background image is quite
> complicated, so to 'cut out' the main section, and paste it back with
shadow
> would mess up the look of the background image.
> >
> >
> > So I was wondering if anyone had any other ideas on what to do, or
even if
> there is a bit of code that could be implemented?
> >
> >
> > The page is still in development, and is not live, but if you would
like
> to view it, I have uploaded an image to my Flickr account, so you can
see
> what I'm talking about. The URL is:
> >
> >
> > http://www.flickr.com/photos/tom_r07/355733167/
>
>
> Hi Tom!
...
> You could also create one background image, that wuld be quite big in
> width... something like 1700 px... that wuold contain middle space as
wide
> as the site is, with added shadows on both sides...

Goodness, I hate it when people do that. A single huge background
image is a very heavy solution.

If you have the background pattern positioned like so:

background: color url(image) CENTER TOP;

or TOP CENTER, then the pattern starts from the top-middle just like
the content does. Then you have the same segment of the pattern on
both sides of the body content all the time. Then you just take a
screenshot of your page, cut out what shows of the pattern on both
sides and the bottom, add a gradient on top that is a "shadow," and
add those back in. On the sides you use repeat-y to tile it, and on
the bottom you use repeat-x.

It's a simple solution that doesn't require massive images or transparent
PNGs.

And if that makes absolutely no sense to you, let me know and I'll try
to put together an example.




Christian, I was not sugestin the use of  one  big image, but one that is
large in width... and duplicates in hegiht... the same as you explained... I
am sorry, if I wrote a not understandable suggestion,...


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

RE: [WSG] Free Screen Readers (was: Logo and H1's)

2007-01-13 Thread Steve Green
I am currently doing a review of all the screen readers that are available.
This will take a few months because there are more than you may imagine.
Here are some initial observations:

JAWS - Eye wateringly expensive but it's the best there is despite having
plenty of shortcomings. Has at least 50% market share.

WindowEyes - Expensive but pretty good. Better than JAWS for some
applications but not others. Not much different for web browsing.

HAL and SuperNova - Similar to WindowEyes.

Those three are serious professional products that work to varying degrees
with Windows and most applications.

Note that you can not use the trial versions for testing. Read the license
terms. The trial version is to help you make a purchasing decision. It is
not a convenient loophole for people who cannot or do not want to buy it.

IBM Home Page Reader - Little used and no longer supported. I don't know
much about it.

Virgo - I only recently found out about this screen reader and have not used
it yet.

Thunder - I am not very familiar with this but one of our blind trainers has
evaluated it and is not very impressed. It has potential but the creators
need funding to improve it. The creators say it is not intended for reading
web pages directly. You are supposed to use it in conjunction with Webbie,
which creates a linearised version of the page but also removes semantic
structure.

VoiceOver - Comes with Mac OS X 10.4 and above. All OS X applications have
some level of support. I am pretty unimpressed because for instance it does
not announce the presence of any semantic structure such as headings and
lists, and all keyboard controls require 3 keys, which gets tiring. It has a
tiny but strong following but these appear to be typical Apple fanboys who
would never admit it was less than perfect even if it crashed every two
minutes. Also they have few alternatives.

Narrator - Built into Windows 2000 and XP and works to some extent with all
applications. Only really any use for getting you out of trouble if your
primary screen reader fails. On web pages it only reads the links.

Fire Vox - Free extension for Firefox. I have tested this extensively and
corresponded with its creator, who has been very helpful. However, it is
really just a pet project and it is a long way short of being usable as a
primary screen reader. The user experience is nothing like JAWS. If you're
looking for a free screen reader it's better than nothing but don't imagine
you're getting the equivalent of one of the big 3.

Fangs - Don't bother. It claims to produce a text version of what JAWS would
read but there are some significant shortcomings. Firstly the behaviour of
JAWS varies from version to version; which version is it emulating? The
biggest issue is that it doesn't remotely give you any idea of the user
experience. Assessing the comprehensibility of a page involves much more
than simply knowing what words will be spoken. It would help if the text was
laid out in an approximation of the mental model the user will build but
frankly it's not worth the trouble.

The problem with most of the cheap or free screen readers is that they don't
convey semantic structure and the user experience is nothing like the big 3
professional products.

Steve Green
Director
Test Partners Ltd / First Accessibility
www.testpartners.co.uk
www.accessibility.co.uk

 

-Original Message-
From: listdad@webstandardsgroup.org [mailto:[EMAIL PROTECTED]
On Behalf Of Matthew Smith
Sent: 12 January 2007 22:36
To: wsg@webstandardsgroup.org
Subject: [WSG] Free Screen Readers (was: Logo and H1's)

Quoth Rob O'Rourke at 01/13/07 08:25...

> I've not managed to get a screen-reader working very well for testing 
> so far, does anyone know of one (preferably free) that provides a 
> fairly typical screen reader experience?
> 
> JAWS is a bit out of my price range.

You could try the Fangs[1] extension for Firefox.  Fangs renders the page as
text, but the text that would (probably) be spoken by Jaws.  I have never
managed to get it working myself, but it may be worth a look.

Cheers

M

References

1 - 

--
Matthew Smith
IT Consultancy & Web Application Development
Business: http://www.kbc.net.au/
Personal: http://www.smiffysplace.com/
LinkedIn: http://www.linkedin.com/in/smiffy


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Shadows on a div?

2007-01-13 Thread Christian Montoya

On 1/13/07, Mihael Zadravec <[EMAIL PROTECTED]> wrote:



On 1/13/07, Christian Montoya <[EMAIL PROTECTED]> wrote:
> On 1/13/07, Mihael Zadravec <[EMAIL PROTECTED]> wrote:
> >
> >
> > On 1/13/07, Tom Roper <[EMAIL PROTECTED] > wrote:
> > >
> > > Hi everyone,
> ...
> > > The problem I've got a the minute is I've built a page for a client,
but
> > now she would like shadow on either side of the page, I know it would be
> > possible to do it in photoshop/gimp, but the background image is quite
> > complicated, so to 'cut out' the main section, and paste it back with
shadow
> > would mess up the look of the background image.
> > >
> > >
> > > So I was wondering if anyone had any other ideas on what to do, or
even if
> > there is a bit of code that could be implemented?
> > >
> > >
> > > The page is still in development, and is not live, but if you would
like
> > to view it, I have uploaded an image to my Flickr account, so you can
see
> > what I'm talking about. The URL is:
> > >
> > >
> > > http://www.flickr.com/photos/tom_r07/355733167/
> >
> >
> > Hi Tom!
> ...
> > You could also create one background image, that wuld be quite big in
> > width... something like 1700 px... that wuold contain middle space as
wide
> > as the site is, with added shadows on both sides...
>
> Goodness, I hate it when people do that. A single huge background
> image is a very heavy solution.
>
> If you have the background pattern positioned like so:
>
> background: color url(image) CENTER TOP;
>
> or TOP CENTER, then the pattern starts from the top-middle just like
> the content does. Then you have the same segment of the pattern on
> both sides of the body content all the time. Then you just take a
> screenshot of your page, cut out what shows of the pattern on both
> sides and the bottom, add a gradient on top that is a "shadow," and
> add those back in. On the sides you use repeat-y to tile it, and on
> the bottom you use repeat-x.
>
> It's a simple solution that doesn't require massive images or transparent
PNGs.
>
> And if that makes absolutely no sense to you, let me know and I'll try
> to put together an example.


Christian, I was not sugestin the use of  one  big image, but one that is
large in width... and duplicates in hegiht... the same as you explained... I
am sorry, if I wrote a not understandable suggestion,...


I understood the idea, and I didn't mean to come across as angry or
anything. The one of using a very wide but short image is not so bad I
guess, but it is heavy handed. The solution I gave is more complex on
the code side but lighter on the images.

Though I should mention that the part about shadowing the bottom is a
little harder than I first said... but Tom isn't planning to do that
so it's fine :)

--
--
Christian Montoya
christianmontoya.net .. designtocss.com


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Shadows on a div?

2007-01-13 Thread Paul Novitski

At 1/13/2007 05:10 AM, Tom Roper wrote:
The problem I've got a the minute is I've built a page for a client, 
but now she would like shadow on either side of the page

http://www.flickr.com/photos/tom_r07/355733167/


I don't see that this problem requires transparency at all.  Just 
create two tall skinny images that run down the sides of your main 
container that contain your drop-shadow on a vertical slice of your 
background pattern.


In order for this to work, your content block has to be in a fixed 
relationship to the background pattern so that the vertical slices of 
background with the drop-shadow will match up with the true 
background.  Because your content block is centered, you might think 
at first that you wouldn't be able to predict where the content block 
will intersect with the background pattern, but it turns out to be 
quite easy: just center the repeating background image.



Aside, when does a shadow fall on both sides of an object?  The 
answer is when the light source is between the observer and the 
object casting the shadow.  (If the light source were off to one 
side, the shadow would be on only one side; if the light source were 
behind the observer the shadows wouldn't be visible to the 
observer.)  Shadows on both sides constitute a fairly unusual 
circumstance in real life.  If your client were happy with a more 
realistic drop-shadow on one or two sides of the box, perhaps your 
problem would be easier to implement.  Or is the goal to create a 
'glow' and not a shadow per se?



At 1/13/2007 06:40 AM, Mihael Zadravec wrote:
One option would be a use of png image for shadows... but as they 
are not supported by all browsers (like IE6 of corse..) that would 
not be the best solution.


I beg to differ: PNG images are supported by IE6.  You just have to 
use Microsoft's proprietary triggers (e.g. filter: in the 
stylesheet).  There are dozens of essays on this subject locatable 
through Google; here are just a couple:


Microsoft:
http://msdn.microsoft.com/workshop/author/filter/reference/filters/alphaimageloader.asp

CSS-D wiki:
http://css-discuss.incutio.com/?page=AlphaBetaPngSupport

Ingo Chao:
http://www.satzansatz.de/cssd/tmp/alphatransparency.html


Regards,
Paul 




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



RE: [WSG] Logo and H1's

2007-01-13 Thread Steve Green
 
Patrick wrote

"In general terms, what I'm trying to convey here is: it's easy to pick up a
screenreader as a sighted user, do some testing, and come to some
conclusions, all with the right intentions of course, like "oh, this must be
annoying for those users"...but, not being a blind user who uses that
technology day in, day out, it's also possible to draw some erroneous
conclusions, or to seek absolute, black and white maxims ("this should never
be done") where there are really just opinions, personal preferences, and
lots of shades of gray."


Which leads perfectly into a plug for our free JAWS screen reader demos. One
of our blind testers talks about how blind people visualise web pages and
navigate through them. We then have some practical examples where he visits
sites he has not seen before so you see his approach to browsing, the
problems he encounters and how he overcomes them (if he can!). The next one
on Monday is fully booked (maybe I can squeeze in one more) but there will
be another in February. You can register at
www.accessibility.co.uk/free_jaws_demo.htm

Steve Green
Director
Test Partners Ltd / First Accessibility
www.testpartners.co.uk
www.accessibility.co.uk



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Logo and H1's

2007-01-13 Thread Patrick H. Lauke

Steve Green wrote:


Which leads perfectly into a plug for our free JAWS screen reader demos.


Pssst...where's my agreed commission? ;)

P
--
Patrick H. Lauke
__
re·dux (adj.): brought back; returned. used postpositively
[latin : re-, re- + dux, leader; see duke.]
www.splintered.co.uk | www.photographia.co.uk
http://redux.deviantart.com
__
Web Standards Project (WaSP) Accessibility Task Force
http://webstandards.org/
__


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



RE: [WSG] Logo and H1's

2007-01-13 Thread Steve Green

I bought your book - isn't that enough? And if you make the 300-mile round
trip to the demo I'll even buy lunch.

Steve
 

-Original Message-
From: listdad@webstandardsgroup.org [mailto:[EMAIL PROTECTED]
On Behalf Of Patrick H. Lauke
Sent: 13 January 2007 19:53
To: wsg@webstandardsgroup.org
Subject: Re: [WSG] Logo and H1's

Steve Green wrote:

> Which leads perfectly into a plug for our free JAWS screen reader demos.

Pssst...where's my agreed commission? ;)

P
--
Patrick H. Lauke
__
re.dux (adj.): brought back; returned. used postpositively [latin : re-, re-
+ dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk
http://redux.deviantart.com
__
Web Standards Project (WaSP) Accessibility Task Force
http://webstandards.org/
__


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Making "sliding door" tab navigation fit 100%

2007-01-13 Thread Mordechai Peller

Skip Evans wrote:

How can I set them so they fill 100% across the
table's TD cell, regardless of browser width, etc? 
Technically, I don't think "Sliding Doors" is the approach you're 
looking for as that's more about allowing the the tabs to expand to 
accommodate changing font sizes, but I suppose it's a reasonable 
starting point for the solution. You should note that by forcing the 
tabs to all be in one line accessibility will be reduced because you've 
reduced the upper limit to how much the fonts can be enlarged by the 
user before the text will no longer fit in it's box. How much of a 
problem this is will vary based on how much text is in the menu and how 
wide the users screen is.


So, assuming your list structure looks like this:


   Tab1
   Tab2
   .
   .
   .



You have two approaches to consider: will the tabs be equal widths or 
will they be proportional? In either case the CSS will be almost 
identical to the Sliding Doors' CSS, so I'll only point out the highlights.


For starters, I'm assuming that you don't know the exact pixel width of 
the container (the  in your case) you'll need to calculate the 
widths for your s. For the equal widths case divide 100 by the 
number of tabs  to get the percentage.


For proportional widths it's a little more complicated. You'll need to 
assign each  with an ID to allow you to assign a different width to 
each one (if you don't need to support IE 6 or earlier you could use a 
selector instead of IDs). You'll need to calculate the widths so that 
the total is 100%. How to do that can be tricky. You could use 
JavaScript to do so and just let those without js not have 100% width. 
If you use a mono spaced font divide the number of character  in each 
tab by the total number (including spaces) to get the percentage. With 
proportional fonts you have the problem of the width of each glyph will 
vary from character to character, from font to font, and from platform 
to platform. My advice is to pick one setup, measure it, and calculate 
the percentages you'll need.


Note that in all cases you may need to reduce the percentages slightly 
to avoid rounding errors causing a total to be greater than 100%.


Also, you'll probably want to add "{text-align : center;}" to your 
anchors (unless you don't want the text centered).


On a side note, I generally recommend (as I'm sure many others on this 
list would agree) not using tables for layout.



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



[WSG] Can't assign links specific styles

2007-01-13 Thread Skip Evans

Hey all,

I'm a PHP/MySQL coder by trade, hence a bit green
with CSS, as this question will show.

I have two sets of style elements to style two
different kinds of links, as the code below shows.

.shoplogo a, a:visited {
 border: none;
 color: #000;
 background-color: #b9e4ff;
 text-decoration: none;
}

.shoplogo a:hover {
 border: none;
 color: #000;
 background-color: #b9e4ff;
 text-decoration: none;

}

.pagelink a, a:visited {
 display: block;
 width: 6em;
 padding: 0.2em;
 line-height: 1.4;
 background-color: #47afe2;
 border: 1px solid black;
 color: #00;
 text-decoration: none;
 text-align: center;
}

.pagelink a:hover {
 display: block;
 width: 6em;
 padding: 0.2em;
 line-height: 1.4;
 background-color: #369;
 border: 1px solid black;
 color: #ff;
 text-decoration: none;
 text-align: center;
}

And then I have code in an html file with the
following two lines, in different places.

http://shopstudios.com";>

  

FASHION

The problem is that both links take on the
properties of whatever style set, or specs for the
links, is listed last in the CSS file.

I would think since they have separate names, that
each would adhere to the properties of the one
they are called by.

I know to all of you this is trivial and you're
rolling your eyes, but I'm a bit confused.

Thanks,
Skip


--
Skip Evans
Big Sky Penguin, LLC
61 W Broadway
Butte, Montana 59701
406-782-2240

=-=-=-=-=-=-=-=-=-=-=

Check out PHPenguin, a lightweight and versatile
PHP/MySQL development framework.

http://phpenguin.bigskypenguin.com


--
Skip Evans
Big Sky Penguin, LLC
61 W Broadway
Butte, Montana 59701
406-782-2240

=-=-=-=-=-=-=-=-=-=-=

Check out PHPenguin, a lightweight and versatile 
PHP/MySQL development framework.


http://phpenguin.bigskypenguin.com


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Can't assign links specific styles

2007-01-13 Thread Gunlaug Sørtun

Cross-list answer... :-)

You have the class on the anchor itself - *not* the anchor inside an
element with the class.
Also I miss the :link pseudo-class.

You should write...

a.shoplogo:link, a.shoplogo:visited {
stuff
}

a.pagelink:link, a.pagelink:visited {
stuff
}

...etc.



regards
Georg
--
http://www.gunlaug.no


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Can't assign links specific styles

2007-01-13 Thread David Dixon

Hi Skip,

Firstly, you'll save yourself a lot of coding if you trim those rules 
down a little. As you styling the general 'a' tag, then when styling 
a:hover etc, then you only need to add definitions for the changed 
styles. Also, since styling a:visited is not need when styling the 
general 'a' tag (a:visited, a:hover et al will all automatically have 
the general style until changes). eg:


a.pagelink {
   display: block;
   width: 6em;
   padding: .2em;
   line-height: 1.4em;
   background-color: #47afe2;
   border: 1px solid black;
   color: #000;
   text-decoration: none;
   text-align: center;
}

a.pagelink:hover {
   background-color: #369;
   color: #ff;
}

Also, not the the soltuion to your problem... you were defining a style 
that target a link tag inside an element with the class 'shoplogo', not 
a link with the class of shoplogo.


.shoplogo a {} -> my link

a.shoplogo {} -> a link

Thanks,

David.

Skip Evans wrote:

Hey all,

I'm a PHP/MySQL coder by trade, hence a bit green
with CSS, as this question will show.

I have two sets of style elements to style two
different kinds of links, as the code below shows.

.shoplogo a, a:visited {
  border: none;
  color: #000;
  background-color: #b9e4ff;
  text-decoration: none;
}

.shoplogo a:hover {
  border: none;
  color: #000;
  background-color: #b9e4ff;
  text-decoration: none;

}

.pagelink a, a:visited {
  display: block;
  width: 6em;
  padding: 0.2em;
  line-height: 1.4;
  background-color: #47afe2;
  border: 1px solid black;
  color: #00;
  text-decoration: none;
  text-align: center;
}

.pagelink a:hover {
  display: block;
  width: 6em;
  padding: 0.2em;
  line-height: 1.4;
  background-color: #369;
  border: 1px solid black;
  color: #ff;
  text-decoration: none;
  text-align: center;
}

And then I have code in an html file with the
following two lines, in different places.

http://shopstudios.com";>
 
   

FASHION

The problem is that both links take on the
properties of whatever style set, or specs for the
links, is listed last in the CSS file.

I would think since they have separate names, that
each would adhere to the properties of the one
they are called by.

I know to all of you this is trivial and you're
rolling your eyes, but I'm a bit confused.

Thanks,
Skip





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***