Reduce white Space on blog post + Formatting and jump section issues

[damarley]

Hi All, I have three questions regarding this blog post I’m working on: https://www.aventri.com/blog/top-meeting-event-venues-in-the-united-states?hs_preview=hiddFPos-24022...

1. How can I can reduce the amount of white space in between the name of each venue, the location, and the paragraph that follows?

2. How can I change the color of bolded text? All bolded text change to red, is there a way I can manual change this?

3. I coded out jump section on this blog and it works great, however when I jump to a specific section the title gets cut off. Is there a way I can revise this so that the section title is visible? 

Thank you for your help in advance!

[krishangtechn]

@damarley 

Here's a solution for the same: You need to replace the below class in style.min.css with below

1. How can I reduce the amount of white space between the name of each venue, the location, and the paragraph that follows?
Answer:
a)  Please remove below style becuase it show location in minus 30 px left side 

.blog-post .content span p:first-of-type{
margin-left: -30px;          

margin-right: -30px; */

}
b) 
.blog-post .content span p:first-of-type {
letter-spacing: 0.1rem;
/* margin-bottom: 60px; */  (Remove this style for margin for whitespace issue)
/* margin-top: 40px; */
font-weight: 400;
line-height: 2;
font-size: 2rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: gray;
}
c) 
.blog-post .content p {
color: inherit;
letter-spacing: 0px;
line-height: 1.9;
font-size: 1.8rem;
/* margin-bottom: 3rem; */ .  (Please remove or comment this code)
}

d)

.blog-post .content span p:first-of-type+p {
clear: both;
margin-top: 25px; ( Here default top marging is 50 please decrease till 25px)
}

2. How can I change the color of bolded text? All bolded text change to red, is there a way I can manually change this?

Answer:
.blog-post .blog-post-body-content-wrapper h2, .blog-post .blog-post-body-content-wrapper h2 span {
font-size: 5rem;
color: #ff0000;    (add this for red color)
line-height: 8.5rem;
letter-spacing: 0;
margin-bottom: 3rem;
font-family: "effra",sans-serif;
}
The last point need to check will keep you posted

PS: Apply above style will hopefully work but you can just comment old class and apply new as per above and see.

If you like the solution kindly mark as solution and upvote.

Best Regards,

Ramesh

KrishangTechnolab

[damarley]

Hi @krishangtechn thank you for your help. 

However, I'm still a little confused. 

What exact code do I need to remove/alter in order to mimiize the white space? 

If you can explain that in greater detail that would be greatly appreacited.

Thanks in advance! 

[krishangtechn]

@damarley 

Open style.min.css 

just find below class and in style.min.css simple and replace with below stylesheet that's it

Or

just apply the red color text in this particular class with copy and paste

.blog-post .content span p:first-of-type{
/* margin-left: -30px;          

margin-right: -30px; */

}

.blog-post .content span p:first-of-type {
letter-spacing: 0.1rem;
/* margin-bottom: 60px; */  (Remove this style for margin for whitespace issue)
/* margin-top: 40px; */
font-weight: 400;
line-height: 2;
font-size: 2rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: gray;
}

.blog-post .content p {
color: inherit;
letter-spacing: 0px;
line-height: 1.9;
font-size: 1.8rem;
/* margin-bottom: 3rem; */ 
}

.blog-post .content span p:first-of-type+p {
clear: both;
margin-top: 25px; 
}

.blog-post .blog-post-body-content-wrapper h2, .blog-post .blog-post-body-content-wrapper h2 span {
font-size: 5rem;
color: #ff0000;    
line-height: 8.5rem;
letter-spacing: 0;
margin-bottom: 3rem;
font-family: "effra",sans-serif;
}

Please let me know if still confusion I'll be happy to assist you. 

Best,

Ramesh Gosiya

KrishangTechnolab