Author Styling works great… except on author pages

[Jen]

I found this really cool author styling somewhere on the Generatepress website (this is copied from my customizer):

/* Author Styling */
.entry-meta:not(footer),
.entry-meta .posted-on,
.entry-meta .author-wrap {
    display: flex;
}

.entry-meta {
    align-items: center;
    justify-content: center;
}

.entry-meta .posted-on,
.entry-meta .author-wrap {
    flex-direction: column;
    font-size: 16px;
    padding: 0 25px;
    flex: 1;
}

.entry-meta .posted-on {
    text-align: right;
}

.entry-meta .label {
    font-size: 14px;
    color: #aaa;
    margin-bottom: 0.25em;
}

.author img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    vertical-align: middle;
}

It works great and looks great on regular blog pages, and the design elements are fine on non-blog pages. The exception is on author pages, like the URL I included. It’s more of an annoyance than anything else, but it makes me crazy that I can’t figure it out. Thanks! I love what I’ve been able to do with this theme.

[Leo]

Hi there,

Just to confirm, basically, you’d like to exclude the CSS above from applying to the author archives?

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Jen]

Huh. Yeah, I think that would work! I didn’t think of it that way. How would I do that? Thanks! Jen

[Leo]

Try this CSS instead:

/* Author Styling */
body:not(.author) .entry-meta:not(footer),
body:not(.author) .entry-meta .posted-on,
body:not(.author) .entry-meta .author-wrap {
    display: flex;
}

body:not(.author) .entry-meta {
    align-items: center;
    justify-content: center;
}

body:not(.author) .entry-meta .posted-on,
body:not(.author) .entry-meta .author-wrap {
    flex-direction: column;
    font-size: 16px;
    padding: 0 25px;
    flex: 1;
}

body:not(.author) .entry-meta .posted-on {
    text-align: right;
}

body:not(.author) .entry-meta .label {
    font-size: 14px;
    color: #aaa;
    margin-bottom: 0.25em;
}

body:not(.author) .author img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    vertical-align: middle;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Jen]

That works! Thanks!

[Leo]

No problem 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts