Quantcast

Selecting xml: attributes using CSS attr()

classic Classic list List threaded Threaded
8 messages Options
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Selecting xml: attributes using CSS attr()

John P. McCaskey-2
Does anyone know how to get CSS’s attr() function to work with namespaced attributes such as <a class="moz-txt-link-freetext" href="xml:base">xml:base and <a class="moz-txt-link-freetext" href="xml:id">xml:id?

note:before {content: attr(<a class="moz-txt-link-freetext" href="xml:id">xml:id)}

produces nothing. I tried defining the namespace in CSS (using


@namespace
xml "http://www.w3.org/XML/1998/namespace/

) and in the <html> element (using


xmlns:xml  ="http://www.w3.org/XML/1998/namespace/"

) and get told

xml namespace prefix mapped to wrong URI
.

But I don’t think that’s the main problem, because it doesn’t work if I use a different prefix. I tried

attr(xml\\:id)


but that didn’t work either.

Can it be done? Does anyone know the magic formula?

John


Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Selecting xml: attributes using CSS attr()

George Bina
Hi,


The namespace should be
in XML
xmlns:xml="http://www.w3.org/XML/1998/namespace"
(note the missing / as the last character)

in CSS
@namespace xml "http://www.w3.org/XML/1998/namespace";
...
note:before {
   content: attr(xml|id);
}

Best Regards,
George
--
George Cristian Bina
<oXygen/> XML Editor, Schema Editor and XSLT Editor/Debugger
http://www.oxygenxml.com

On 23/02/17 00:04, John P. McCaskey wrote:

> Does anyone know how to get CSS’s attr()function to work with namespaced
> attributes such as xml:baseand xml:id?
>
> note:before {content: attr(xml:id)}
>
> produces nothing. I tried defining the namespace in CSS (using
>
> @namespace xml "http://www.w3.org/XML/1998/namespace/
>
> ) and in the <html> element (using
>
> xmlns:xml  ="http://www.w3.org/XML/1998/namespace/"
>
> ) and get told
>
> xml namespace prefix mapped to wrong URI.
>
> But I don’t think that’s the main problem, because it doesn’t work if I
> use a different prefix. I tried
>
> attr(xml\\:id)
>
> but that didn’t work either.
>
> Can it be done? Does anyone know the magic formula?
>
> John
>
>
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Selecting xml: attributes using CSS attr()

John P. McCaskey-2

Have you seen that work?

It’s not working for me in IE-Edge or in Chrome.

John


On 2/22/2017 5:40 PM, George Bina wrote:
Hi,


The namespace should be
in XML
xmlns:xml="http://www.w3.org/XML/1998/namespace"
(note the missing / as the last character)

in CSS
@namespace xml "http://www.w3.org/XML/1998/namespace";
...
note:before {
  content: attr(xml|id);
}

Best Regards,
George
--
George Cristian Bina
<oXygen/> XML Editor, Schema Editor and XSLT Editor/Debugger
http://www.oxygenxml.com

On 23/02/17 00:04, John P. McCaskey wrote:
Does anyone know how to get CSS’s attr()function to work with namespaced
attributes such as <a class="moz-txt-link-freetext" href="xml:baseand">xml:baseand <a class="moz-txt-link-freetext" href="xml:id">xml:id?

note:before {content: attr(<a class="moz-txt-link-freetext" href="xml:id">xml:id)}

produces nothing. I tried defining the namespace in CSS (using

@namespace xml "http://www.w3.org/XML/1998/namespace/

) and in the <html> element (using

xmlns:xml  ="http://www.w3.org/XML/1998/namespace/"

) and get told

xml namespace prefix mapped to wrong URI.

But I don’t think that’s the main problem, because it doesn’t work if I
use a different prefix. I tried

attr(xml\\:id)

but that didn’t work either.

Can it be done? Does anyone know the magic formula?

John



Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Selecting xml: attributes using CSS attr()

George Bina
See https://www.w3.org/TR/css3-selectors/#attrnmsp
It works in oXygen and in Firefox.

test.xml
========
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="test.css"?>
<TEI xmlns="http://www.tei-c.org/ns/1.0">
   <teiHeader>
       <fileDesc>
          <titleStmt>
             <title>Title</title>
          </titleStmt>
          <publicationStmt>
             <p>Publication Information</p>
          </publicationStmt>
          <sourceDesc>
             <p>Information about the source</p>
          </sourceDesc>
       </fileDesc>
   </teiHeader>
   <text>
       <body>
          <p>Some text here.</p>
          <note xml:id="id1">This should work...</note>
       </body>
   </text>
</TEI>


test.css
========
@namespace xml url(http://www.w3.org/XML/1998/namespace);
* {
     display:block;
}
note:before {
     color:red;
     content: attr(xml|id);
}

Best Regards,
George
--
George Cristian Bina
<oXygen/> XML Editor, Schema Editor and XSLT Editor/Debugger
http://www.oxygenxml.com

On 23/02/17 03:56, John P. McCaskey wrote:

> Have you seen that work?
>
> It’s not working for me in IE-Edge or in Chrome.
>
> John
>
>
> On 2/22/2017 5:40 PM, George Bina wrote:
>> Hi,
>>
>>
>> The namespace should be
>> in XML
>> xmlns:xml="http://www.w3.org/XML/1998/namespace"
>> (note the missing / as the last character)
>>
>> in CSS
>> @namespace xml "http://www.w3.org/XML/1998/namespace";
>> ...
>> note:before {
>>   content: attr(xml|id);
>> }
>>
>> Best Regards,
>> George
>> --
>> George Cristian Bina
>> <oXygen/> XML Editor, Schema Editor and XSLT Editor/Debugger
>> http://www.oxygenxml.com
>>
>> On 23/02/17 00:04, John P. McCaskey wrote:
>>> Does anyone know how to get CSS’s attr()function to work with namespaced
>>> attributes such as xml:baseand xml:id?
>>>
>>> note:before {content: attr(xml:id)}
>>>
>>> produces nothing. I tried defining the namespace in CSS (using
>>>
>>> @namespace xml "http://www.w3.org/XML/1998/namespace/
>>>
>>> ) and in the <html> element (using
>>>
>>> xmlns:xml  ="http://www.w3.org/XML/1998/namespace/"
>>>
>>> ) and get told
>>>
>>> xml namespace prefix mapped to wrong URI.
>>>
>>> But I don’t think that’s the main problem, because it doesn’t work if I
>>> use a different prefix. I tried
>>>
>>> attr(xml\\:id)
>>>
>>> but that didn’t work either.
>>>
>>> Can it be done? Does anyone know the magic formula?
>>>
>>> John
>>>
>>>
>
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Selecting xml: attributes using CSS attr()

George Bina
I played with the CSS namespace declaration, that also works, bit it
should be:

@namespace xml "http://www.w3.org/XML/1998/namespace";

Best Regards,
George
--
George Cristian Bina
<oXygen/> XML Editor, Schema Editor and XSLT Editor/Debugger
http://www.oxygenxml.com

On 23/02/17 05:42, George Bina wrote:

> See https://www.w3.org/TR/css3-selectors/#attrnmsp
> It works in oXygen and in Firefox.
>
> test.xml
> ========
> <?xml version="1.0" encoding="UTF-8"?>
> <?xml-stylesheet type="text/css" href="test.css"?>
> <TEI xmlns="http://www.tei-c.org/ns/1.0">
>   <teiHeader>
>       <fileDesc>
>          <titleStmt>
>             <title>Title</title>
>          </titleStmt>
>          <publicationStmt>
>             <p>Publication Information</p>
>          </publicationStmt>
>          <sourceDesc>
>             <p>Information about the source</p>
>          </sourceDesc>
>       </fileDesc>
>   </teiHeader>
>   <text>
>       <body>
>          <p>Some text here.</p>
>          <note xml:id="id1">This should work...</note>
>       </body>
>   </text>
> </TEI>
>
>
> test.css
> ========
> @namespace xml url(http://www.w3.org/XML/1998/namespace);
> * {
>     display:block;
> }
> note:before {
>     color:red;
>     content: attr(xml|id);
> }
>
> Best Regards,
> George
> --
> George Cristian Bina
> <oXygen/> XML Editor, Schema Editor and XSLT Editor/Debugger
> http://www.oxygenxml.com
>
> On 23/02/17 03:56, John P. McCaskey wrote:
>> Have you seen that work?
>>
>> It’s not working for me in IE-Edge or in Chrome.
>>
>> John
>>
>>
>> On 2/22/2017 5:40 PM, George Bina wrote:
>>> Hi,
>>>
>>>
>>> The namespace should be
>>> in XML
>>> xmlns:xml="http://www.w3.org/XML/1998/namespace"
>>> (note the missing / as the last character)
>>>
>>> in CSS
>>> @namespace xml "http://www.w3.org/XML/1998/namespace";
>>> ...
>>> note:before {
>>>   content: attr(xml|id);
>>> }
>>>
>>> Best Regards,
>>> George
>>> --
>>> George Cristian Bina
>>> <oXygen/> XML Editor, Schema Editor and XSLT Editor/Debugger
>>> http://www.oxygenxml.com
>>>
>>> On 23/02/17 00:04, John P. McCaskey wrote:
>>>> Does anyone know how to get CSS’s attr()function to work with
>>>> namespaced
>>>> attributes such as xml:baseand xml:id?
>>>>
>>>> note:before {content: attr(xml:id)}
>>>>
>>>> produces nothing. I tried defining the namespace in CSS (using
>>>>
>>>> @namespace xml "http://www.w3.org/XML/1998/namespace/
>>>>
>>>> ) and in the <html> element (using
>>>>
>>>> xmlns:xml  ="http://www.w3.org/XML/1998/namespace/"
>>>>
>>>> ) and get told
>>>>
>>>> xml namespace prefix mapped to wrong URI.
>>>>
>>>> But I don’t think that’s the main problem, because it doesn’t work if I
>>>> use a different prefix. I tried
>>>>
>>>> attr(xml\\:id)
>>>>
>>>> but that didn’t work either.
>>>>
>>>> Can it be done? Does anyone know the magic formula?
>>>>
>>>> John
>>>>
>>>>
>>
>
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Selecting xml: attributes using CSS attr()

Syd Bauman-10
In reply to this post by John P. McCaskey-2
> Have you seen that work?
> It’s not working for me in IE-Edge or in Chrome.

See http://paramedic.wwp.neu.edu/~syd/temp/TEI/tiny_test.xml, which
works for me in Firefox 51.0.1 for Ubuntu, but not in Chromium
55.0.2883.87. (Chromium wants to see "id", not "xml|id".)

If you remember which engines various browsers use (I don't), it may
be helpful to look through
https://en.wikipedia.org/wiki/Comparison_of_layout_engines_(Cascading_Style_Sheets)
for "namespace" and "|".
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Selecting xml: attributes using CSS attr()

John P. McCaskey-2

The selectors works fine. I see nothing that says attr( ) shouldn’t.

This looks to me like a bug in the implementation of attr( ) in webkit-rooted browsers (which is virtually everything but Firefox). :-(

I wonder how to submit a bug report, or even to whom.

--


On 2/23/2017 8:38 AM, Syd Bauman wrote:
Have you seen that work?
It’s not working for me in IE-Edge or in Chrome.
See http://paramedic.wwp.neu.edu/~syd/temp/TEI/tiny_test.xml, which
works for me in Firefox 51.0.1 for Ubuntu, but not in Chromium
55.0.2883.87. (Chromium wants to see "id", not "xml|id".)

If you remember which engines various browsers use (I don't), it may
be helpful to look through
https://en.wikipedia.org/wiki/Comparison_of_layout_engines_(Cascading_Style_Sheets)
for "namespace" and "|".

Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Selecting xml: attributes using CSS attr()

John P. McCaskey-2

Thanks Maarten.

I think I have all the namespaces set correctly and the web server configured correctly, serving my document as application/xhtml+xml. Namespaces are working just fine on CSS selectors, JavaScript, jQuery in all browsers I’ve tried. It’s just attr() on non-Firefox browsers that’s not working.

I tried \: and that didn’t work either. If you have a case where it works on Chrome on Windows, do let me know.

I submitted an issue report to Google. I’ll watch and see if it shows up on the Chromium bug list.

I wonder if there is a JavaScript workaround.

John


On 2/23/2017 5:05 PM, Maarten Janssen wrote:
The CSS selector for namespaces simply uses a | - but involves a proper definition of the namespace, and requires the document to be served as XHTML, which cannot be done in the document itself but has to be done on the server; in HTML there are no namespaces, so any trick to make them work does not have to be supported by browsers; however, this works in most (the best thing in my experience is to simply avoid namespaces whenever you can):

#item::before { content: attr(namespace\:attribute); }


On 23 February 2017 at 22:34, John P. McCaskey <[hidden email]> wrote:

The selectors works fine. I see nothing that says attr( ) shouldn’t.

This looks to me like a bug in the implementation of attr( ) in webkit-rooted browsers (which is virtually everything but Firefox). :-(

I wonder how to submit a bug report, or even to whom.

--


On 2/23/2017 8:38 AM, Syd Bauman wrote:
Have you seen that work?
It’s not working for me in IE-Edge or in Chrome.
See http://paramedic.wwp.neu.edu/~syd/temp/TEI/tiny_test.xml, which
works for me in Firefox 51.0.1 for Ubuntu, but not in Chromium
55.0.2883.87. (Chromium wants to see "id", not "xml|id".)

If you remember which engines various browsers use (I don't), it may
be helpful to look through
https://en.wikipedia.org/wiki/Comparison_of_layout_engines_(Cascading_Style_Sheets)
for "namespace" and "|".
Loading...