Jump to content
TNG Community
spuddled

Title/tagline spacing issue

Recommended Posts

spuddled

Hi there - I've had a site for a while now which integrates TNG (v. 13) and Wordpress, at https://montgomeryhoffmann.com/wp/. Today I switched to the WordPress Avant theme. Everything transitioned beautifully except for the title and tagline on the TNG page (https://montgomeryhoffmann.com/wp/genealogy). I've attached screenshots of how the title section looks on the main site vs. the TNG sections (title font is larger and overlaps the tagline).

Does anyone have suggestions for how to fix this wonkiness?

Megan

Title on TNG Area.png

Title on Main Site.png

Share this post


Link to post
Share on other sites
fluffy82

The mytngstyle css is overriding the WordPress one.

Your mytngstyle changes (for example) the .site-branding padding to 0.23em while the original is 40px 0 60px.
It also sets additional forced height and width for any <a> tag within the .site-branding div.
There's other things that changed.

If I were you, I would remove (or comment ou) all references to .site-branding in the mytngstyle file. It should then automatically pick up the WordPress css.

PS what I do (but it's a lot of work and a lot of fiddling around) is completely ignore the TNG css, and have the site use WordPress css only. I then add the missing css lines that are specific to TNG to the WordPress customizer.

Share this post


Link to post
Share on other sites
spuddled

Thank you for this! I went in and commented out (I think) the part specific to .site-branding, but the header/tagline are still overlapping. Since I just barely know enough about what I'm doing, it's quite possible that I'm missing something. Here is my current mytngstyle file content; should anything else be commented out/changed?

-------------------------------------------------------------------------

}

input[type="button"]:active, input[type="submit"]:active, input[type="reset"]:active {
    box-shadow: none;
    -o-box-shadow: none;
}

/* link: normal links, active: links in use */
a:link, a:active, div.icons a {
    color: #f0f2f0;
}

/* visited: previously visited links */
a:visited {
    color: #f2f2f2;
}

header li a {
    color: white;
    text-decoration: none;
}

header li a {
    color: white;
    text-decoration: none !important;

/*.site-branding {
    padding: .2em;
}*/

Share this post


Link to post
Share on other sites
spuddled

I just uploaded the file again, and now it seems to be working - I'm not sure what went awry trying to upload the modified file before!

Megan

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×