Home › Forums › Pro Themes › Signify Pro › Margin for H tags settings in Additional CSS
- This topic has 9 replies, 2 voices, and was last updated 2 years, 4 months ago by Timothy Coletti.
-
AuthorPosts
-
August 4, 2022 at 2:22 pm #184715Timothy ColettiParticipant
Hi,
I am trying to modify the margin settings for my H tags in Additional CSS and it looks like H tags will only take on certain attributes… many like margin settings seemed to be blocked, others seem to work, although not on all H tags.
For example, I can do Line Height on H5 but not on others.
I would also like to change color on some but that does not appear to work.
An example of the typography with custom margin spacing that I am trying to publish throughout the site can be seen in the example below using in-line CSS:
<h4 style=”text-align: center; margin: 50px 0px 8px 0px;”>Oasis Hot Stone Massage</h4>
<p style=”text-align: center; margin: 0px 0in 8px 0px;”>Hot Stone Massage reaps the benefits of the heat holding properties of Basalt Lava Stones. Heated stones deeply penetrate warmth to soften tight muscles as your therapist applies a soothing 60 minute massage combined with placing stones on stress points melting your tension away. (not recommended for prenatal)</p>
<p style=”text-align: center;”>$125</p><h4 style=”text-align: center; margin: 8px 0px 8px 0px;”>Oasis Aroma Massage</h4>
<p style=”text-align: center; margin: 0px 0in 8px 0px;”>Choose your own Synergistic Blend for Balance & Grounding, Serenity & Calming, Uplifting Citrus Bliss, Joyful Elevation, Peaceful Lavender or Healing Aroma Touch and receive a complimentary 2 oz bottle for home use!</p>
<p style=”text-align: center;”>$125</p><h4 style=”text-align: center; margin: 8px 0px 8px 0px;”>Oasis Bamboo Massage</h4>
<p style=”text-align: center; margin: 0px 0in 8px 0px;”>Bamboo Massage is an innovative way to provide deep relaxation using warm bamboo sticks to roll and knead. Various bamboo sticks are worked with alternating techniques during the duration of this treatment. A combination of moderate to deep pressure releases the tension held by over-stressed muscles. A unique relaxing massage like no other! (not recommended for prenatal)</p>
<p style=”text-align: center;”>$125</p>Thanks,
Tim
August 5, 2022 at 12:10 am #184728sanamKeymasterPlease add !important at the end of the inline css
<h4 style=”text-align: center; margin: 50px 0px 8px 0px !important;”>Oasis Hot Stone Massage</h4>As for the color you can provide which part of the site you want to change and we will provide you with custom css.
Regards,
ThemepalaceAugust 5, 2022 at 10:20 am #184736Timothy ColettiParticipantHi Sanam,
I am not sue what adding !important does in the inline CSS and I have the inline CSS working fine, but I was not actually looking to do the margins with inline CSS, if I did it would mean styling each and every line line.
I was hoping to add it to my Additional CSS to get it to work globally where appropriate.
For example, this is what I have tried in my Additional CSS and I have marked the things that don’t work. I am most concerned with getting the margins to work:
h1 {
font-weight: 500;
/*not working*/color: #007ac9;
letter-spacing: 1px;
}h2 {
font-weight: 400;
/*not working*/color: #007ac9;
letter-spacing: 1px;
}h3 {
font-weight: 400;
/*not working*/color: #007ac9;
letter-spacing: 1px;
/*not working*/text-align: center; margin: 50px 0px 8px 0px;
}h4 {
font-weight: 400;
/*not working*/color: #007ac9;
letter-spacing: 1px;
/*not working*/text-align: center; margin: 50px 0px 8px 0px;
}h5 {
font-weight: 400;
/*not working*/color: #007ac9;
line-height: 1.6;
letter-spacing: 1px;
/*not working*/text-align: center; margin: 50px 0px 8px 0px;}
h6 {
font-weight: 400;
/*not working*/color: #007ac9;
line-height: 1.6;
}August 6, 2022 at 7:17 am #184751sanamKeymasterYou can try adding !important if it does not work. It will override ALL previous styling rules for that specific property on that element!
For example
h1 {
font-weight: 500;
/*not working*/color: #007ac9;
letter-spacing: 1px;
}h1 {
font-weight: 500;
color: #007ac9 !important;
letter-spacing: 1px;
}August 9, 2022 at 11:18 am #184814Timothy ColettiParticipantHi Sanam,
I see, I thought you were telling me to add it to my inline CSS…
It works great now — Thanks!
Could you let me know if there is a way to keep text links from getting underlining either global or with inline CSS?
Best,
Tim
August 9, 2022 at 12:14 pm #184815Timothy ColettiParticipantHi Sanam,
Sorry… One more important thing. I am about to publish this site, but I need to be able to customize the “site-info” footer area where the copyright notice is.
Thanks,
Tim
August 9, 2022 at 11:41 pm #184824sanamKeymasterHi Tim,
For removing the underline on links please add this css to additional css
ul li a {
text-decoration: none !important;
}
#site-generator .site-info a:hover,
#site-generator .site-info a:focus,
.widget_recent_comments li a {
text-decoration: none;
}As for customizing the site info please go to Customizer >> Theme Options >> Footer Options there you can edit the site info.
Regards,
Sanam- This reply was modified 2 years, 4 months ago by sanam.
August 13, 2022 at 12:48 pm #185125Timothy ColettiParticipantHi Sanam,
Thanks!
I have just published this site from staging.
When it is accessed online at the staging site address (staging20.relaxatoasis.com) everything works great.
When the exact same site (just pushed out live to relaxatoasis.com) the page loads have a distinct delay, specifically, the menu disappears and reloads and is very distracting. Please take a look and let me know what you think.
Many Thanks,
Tim
August 13, 2022 at 1:14 pm #185126Timothy ColettiParticipantHi Sanam,
I actually just noticed that the fonts do not match. Something odd is definitely happening.
Thanks,
Tim
August 13, 2022 at 2:33 pm #185127Timothy ColettiParticipantHi,
Just to let you know, my web host fixed the problem. I think some things got scrambled while the staging site was being pushed out live as some of the scrambled code that was fixed still had some staging URLs in there.
Best,
Tim
-
AuthorPosts
- You must be logged in to reply to this topic.