[css-d] Hide from keyboard navigation

2012-01-19 Thread Barney Carroll
Hello list!

I'm wondering if it's enough to assign visibility:hidden to remove
something from keyboard navigation flow.

I'm working on a single page web app that operates mostly on the basis
of the open canvas concept (navigation causes the viewport to move
around a large 2 dimensional space) with a fixed, persistent
navigation. After following the third item in the top level nav menu,
the markup would look roughly like this. Articles represent what, in
an unscripted version, would be a distinct page; active denotes which
of those pages the user is currently on.

nav/
article id=a1/
article id=a2/
article id=a3 class=active/
article id=a4/
article id=a5/

In the situation outlined above, I don't want the content from
articles other than 3 to be involved in the UX until the user
specifically asks for them via the nav — but at the same time for the
sake of efficiency and layout, I don't want to continuously add and
remove markup. Would the style snippet article{visibility:hidden}
article.active{visibility:visible} be effective enough to restrict
keyboard access as I've described? Are there any other accessiblity
caveats with this method that anyone can think of?


Regards,
Barney Carroll

barney.carr...@gmail.com
+44 7429 177278

barneycarroll.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] first character in a paragraph should be bigger

2012-01-19 Thread Martin

On 16/01/12 23:11, David Laakso wrote:

On Mon, Jan 16, 2012 at 5:40 PM, Martinmhe...@gmail.com  wrote:
Hi there,
I'm wondering if it'd be possible to style the first letter of a paragraph
so that it'd be 3-lines height (I mean generally bigger) as it was in old
texts...


regards

Martin

---

Try [and tweak]:
p:first-letter { font-size: 300%; }
p:first-line { line-height: 100%; }

See: pseudo elements
http://reference.sitepoint.com/css/pseudoelements

Best,
Lady Gaga





Thanks guys. I'll play with it.
__
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/