Skip to content
Grav 2.1 is out: every page speaks Markdown. Read the announcement →

How to change CSS class of page.content() paragraphs?

Started by Muut Archive 10 years ago · 1 replies · 534 views
10 years ago

Here is the problem: Suppose I have :

  1. a CSS with formatting rules defined both in a "blog-item" class and in the "p" element.
  2. A blog post with three paragraphs and a standard item.html.twig template with these lines:
    ------------ <div class="blog-item"> {{ page.content }} </div> -----------------

Now Grav will (correctly) produce the following HTML:
--------------- <div class="blog-item"> <p>Lorem ipsum dolor sit amet, ....</p> <p>Lorem ipsum dolor sit amet, ....</p> <p>Lorem ipsum dolor sit amet, ....</p> </div> ---------------

which will not apply my blog-item rules, as they will be overridden by the more specific "p" rules. I think I need the template to produce HTML as:
--------------- <div > <p class="blog-item">Lorem ipsum dolor sit amet, ....</p> <p class="blog-item">Lorem ipsum dolor sit amet, ....</p> <p class="blog-item">Lorem ipsum dolor sit amet, ....</p> </div> ---------------

Question: what's the Twig/Grav magic that will allow me to do that?

10 years ago

You probably just need to tweak the css to target .blog-item > p rather than just .blog-item

Suggested topics

Topic Participants Replies Views Activity
Archive · by Deleted User, 9 years ago
0 2278 9 years ago
Archive · by Muut Archive, 9 years ago
2 1496 9 years ago
Archive · by Muut Archive, 9 years ago
2 4745 9 years ago
Archive · by Muut Archive, 9 years ago
1 3557 9 years ago
Archive · by Muut Archive, 9 years ago
3 1621 9 years ago