Re: Selecting the parent of an element

:focus state flag is different by its nature. At any given moment of time the view must have one and only one
element with :focus assigned. That element is a target of keyboard events. 
And desktop has also one active window (the one that has focus inside) at any given moment
of time. 

If we want parent(s) of :focus element to get something when its child is in focus then we need to invent
something like :activated. When some input element gets :focus all its parents will get :activated 
flag too.

-- 
Andrew Fedoniouk

http://terrainformatica.com


From: Brian Kardell 
Sent: Friday, October 07, 2011 7:01 AM
To: Rudolph Gottesheim 
Cc: Øyvind Stenhaug ; www-style@w3.org 
Subject: Re: Selecting the parent of an element

I expected that the following would work:

.form-row:focus{...}

I have to admit that it threw me for a loop because I have never tried it and when I did I was surprised to see that it didn't since it is part of the action pseudo classes along with hover and active both of which will work because your child being hovered/active means that you are too... Can someone explain why focus is different?  Am I missing something in the spec that would indicate that difference?

-Brian




On Fri, Oct 7, 2011 at 9:36 AM, Rudolph Gottesheim <r.gottesheim@loot.at> wrote:

  I haven't looked into Selectors 4 yet and so I didn't know about :matches(). Looking at the current spec, I doubt that that would do what I want.

  Here's a snippet to help illustrate my intention:

  <div class="form-row">
         <label for="email">E-Mail</label>
         <input type="email" name="email" id="email" />
  </div>

  I want to have a border/outline around the label AND the input element when the input is focused (which is quite a useful thing to do). With Selectors 3, there is no way to do that, as far as I know.

  Am 07.10.2011 15:21, schrieb Brian Kardell:

    form =.form-row input:focus { outline: solid 1px #ccc; }

    Couldn't you write that as:

    form:matches(form .form-row input:focus) { outline: solid 1px #ccc; }

    On Oct 7, 2011 9:04 AM, "Øyvind Stenhaug" <oyvinds@opera.com

    <mailto:oyvinds@opera.com>> wrote: