0

Given markup like this:

<article data-text="foo">
  <h2>Lorem ipsum dolor sit amet</h2>
  <p>Consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et...</p>
</article>

is it possible to use the data-text attribute in CSS on the children of article?

h2:before {
  content: attr(data-text) ': ';
}
Seraphithan
  • 399
  • 1
  • 4
  • 14
  • Even if you could, it's **not implemented** in all browsers, so I don't recommend you to use this. You want to add ``data-text`` content before ``h2`` content ? – Jérémy Halin Jan 14 '16 at 09:17
  • @JérémyHalin Yes the data-text is supposed to be added to the h2 but other elements as well and I would prefer it no to clutter the markup by adding it to every relevant element since they all share the same parent. And it is implemented in effectively all browsers, see http://caniuse.com/#feat=css-gencontent – Seraphithan Jan 14 '16 at 10:36
  • 1
    Well I don't think it's possible to get ``data`` attribute of parent with **CSS only**. In my opinion you need javascript. – Jérémy Halin Jan 14 '16 at 10:42
  • Simply..."NO". There is no parent selector and so equally, the parent's attribute cannot be selected and inserted into the child's pseudo-element. You need javascript. – Paulie_D Jan 14 '16 at 11:01

0 Answers0