Blog size and format are WAY too big

Support
#1

I think the default choices that I’ve made for my site are really messing with the format and particularly the size of the blog posts. I know there is some CSS that I’ll need to add to adjust for about 7% padding on all sides, and for the font size to be reduced to around a .6rem on the blog home screen. I’m navigating my way through CSS and I’m getting my feet wet in the element/developer tools, but don’t know how to specifically address these changes to only the blog page and individually viewed blog posts. Can you assist?

Sincerely,
Giants Blogs Aren’t for Everyone :laughing:

#2

Hi There,

Please add this custom CSS under X > Theme Options > CSS:

.blog .entry-title {
    font-size: 20px;
}

Let us know how it goes!

#3

That didn’t have any effect on the blog page or the individual posts and it also doesn’t address the padding issues on the content frame.

#4

Hi There,

It seems that you have forgotten to include the site URL.

To target CSS rules only for the Blog page, follow the pattern below.

.blog .entry-title {
    font-size: 20px;
}

To target CSS rules for the single posts, use the following pattern

.single-post .entry-title {
    font-size: 20px;
}

Hope that’s clear.

#5

Sorry - went back and added site in credentials. I currently have the first bit of CSS entered, but it didn’t change anything, cleared the cache and tried again, to no avail. What am I missing here?

#6

Hi There,

Please remove those custom CSS. The issue is because your Based font size is too large. Reduce font size from the following settings:

See this: https://screencast-o-matic.com/watch/cFVfenoeyN

Hope this helps.

#7

Yes, It looks as though this does indeed change the blog page, but it also changes the formatting of all the rest of the text on other pages as well. Is there no other workaround? Isn’t there some kind of !important command that can be given to override the font size for one page?

It also doesn’t solve the issue of there being no padding on the blog post container. The posts go right up to the edge of the window, which I’m trying to resolve.

#8

Hi,

Please change your css code to this.

eg.


.blog .entry-title {
    font-size: 20px !important;
}

.single-post .entry-title {
    font-size: 20px !important;
}

.x-iso-container {
    margin: 0 auto !important;
}

Hope that helps

#9

Yes! That worked for the blog title text and the margin… Only thing left seems to be the preview text is still large. What

#10

Hi,

Please add this code as well.

.blog .entry-content.excerpt {
   font-size:20px !important;
}

Thanks

#11

Thank you!! It looks great!

#12

You’re most welcome.

#13

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.