![Check out Enfold](https://kriesi.at/wp-content/themes/kriesi/images/banner-enfold.jpg)
-
AuthorPosts
-
July 20, 2024 at 9:11 pm #1462575
Hi,
i’m trying to add css for a special headings to specific pages. Other pages will have another css settings.
So I would like to give different css for the special heading on different pages.
I think the best way would be, to add a class to the specific special header in the developer setting, right?But how can i add a class to the css-code below, so it targets the specific special heading element?
#main .container_wrap_first .av-special-heading { margin-top: 0px; padding-top: 12px; padding-bottom: 8px; }
kind regards
JakJuly 20, 2024 at 9:20 pm #1462578Hey Jak73,
Like this:#main .container_wrap_first .av-special-heading.custom-class { margin-top: 0px; padding-top: 12px; padding-bottom: 8px; }
custom-class is your custom class
Best regards,
MikeJuly 20, 2024 at 10:00 pm #1462582Hi Mike,
this works great!
How can i add a text styling too:font-size: 18px; font-family: zen-kaku-gothic-new; font-weight: 500;
Tried to add this to the css above, but it’s not affecting it?
kind regards
JakJuly 20, 2024 at 10:28 pm #1462586July 20, 2024 at 11:30 pm #1462587Sorry, sure…
I just saw, that i can’t add links to special heading. So i changed it to a text-block with links.
How can i use the same css for the text-block instead of the special heading (i added the class “text-about” in developer settings for this text-block)?#main .container_wrap_first .av-special-heading.custom-class { margin-top: 0px; padding-top: 12px; padding-bottom: 8px; }
and also use this css for the font-style too:
font-size: 18px; font-family: zen-kaku-gothic-new; font-weight: 500;
Sorry for my confusion.
kind regards
Jak-
This reply was modified 1 month, 2 weeks ago by
Jak73.
July 21, 2024 at 11:02 am #1462598Hi,
Please try this CSS instead:
#main .avia_textblock.text-about { margin-top: 0px; padding-top: 12px; padding-bottom: 8px; font-size: 18px; font-family: zen-kaku-gothic-new; font-weight: 500; }
Best regards,
RikardJuly 21, 2024 at 11:12 am #1462600Hi Rikard,
thanks for your fast reply!
That works nice with the font-family and the font-size.
But i’m not able to reduce the space above and below the text-block?
I tried to change:padding-top: 12px; padding-bottom: 8px;
but it does not change as on the screenshot?
kind regards
JakJuly 21, 2024 at 4:44 pm #1462615Hi,
This is what is currently appyling:
#main .avia_textblock.text-about { margin-top: 0px; padding-top: 5px; padding-bottom: 5px; font-size: 19px; font-family: zen-kaku-gothic-new; font-weight: 500; word-spacing: 18px; }
Changing the top and bottom padding values work when I test it in the browser.
Best regards,
Rikard -
This reply was modified 1 month, 2 weeks ago by
-
AuthorPosts
- You must be logged in to reply to this topic.