[safesiteParticipant]

On http://savingantiquities.mystagingwebsite.com/you-can-help/

How can I decrease the space between GET INVOLVED and LEARN WITH US…WORK WITH US…MAKE A DIFFERENCE. They are currently in 2 rows using VC. Log in to follow.

[safesiteParticipant]

This reply has been marked as private.

[ChristopherModerator]

Hi Cindy,

You can add special classes to decrease or completely strip out the padding or margin.
Just go to the desired content band and in the edit screen of that inside the class option please add mtn and/or ptn to strip out top margin/padding.

You can get more informations about the classes and how to use them following the link below:

http://theme.co/x/member/kb/css-class-index/

Hope it helps.

[safesiteParticipant]

Thanks for the info on classes. But my 2 lines of text are in different 2 rows within a content band, how do I apply mtn (I tried this and number happened) to one row without it affecting the entire band? Can I have both lines of text in a single row and apply some code to it to adjust spacing between those 2 lines of text? I want to do this so that I can put background image underneath the text, as you can see. I tried the inspect element on Chrome and it didn’t show me where the spacing is, except that it is a vc row.

[RadModerator]

Hi Cindy,

Seems like they are using head titles (eg. h1, h2, h3, etc). Why no just include them in single head title to make them in one row? Or still, use mtn from second to last head lines (eg. <h5 class=”mtn”> ). And since they are not shortcode which directly added into its vc column, then you may edit it at classic editor.

Is this what you’re trying to achieve?

Thanks!

[safesiteParticipant]

I hope this makes sense, and I’m sure what I’ve done is not the best way to do it. Your advice is greatly appreciated. Actually the large text you see GET INVOLVED is <p style=”text-align: center; font-size: 500%; letter-spacing: 0px;”><span style=”color: #eb1515;”>GET INVOLVED</span></p>

and the line below LEARN WITH US…WORK WITH US…MAKE A DIFFERENCE is <p style=”text-align: center; font-size: 120%; letter-spacing: 0px;”><span style=”color: #666666;”>LEARN WITH US…WORK WITH US…MAKE A DIFFERENCE</span></p>

They are both normal body text. I didn’t use head titles because I set the headers to be extra bold in customizer (which is what I want for the blog and other titles) but I want the lighter weight to be used as heads on these splash pages (this is the first one I am trying to build). I didn’t know how to assign different font weights for the different hi, h2, h3, etc. that’s why I did it this way, otherwise I would have made them h1, h2, h3. I still am not understanding how to bring these 2 lines of text closer together, vertically.

I’m not understanding:

Or still, use mtn from second to last head lines (eg. <h5 class=”mtn”> ). And since they are not shortcode which directly added into its vc column, then you may edit it at classic editor.

Sorry to be so ignorant about this.

[RadModerator]

Hi there,

This the code generated from the browser.

<h4 style="text-align: center;">GET INVOLVED</h4>
<h5 style="text-align: center;">Light a candle for global heritage</h5>
<h5 style="text-align: center;">Tell us what you think</h5>
<h5 style="text-align: center;"><a href="http://www.facebook.com/groups/savingantiquities/" target="_blank">Join the discussions</a></h5>
<h5 style="text-align: center;">Volunteer with us</h5>
<h5 style="text-align: center;">Become an intern</h5>

I checked the admin and your statement is also true. I can’t even find any incorrectly formatted elements to cause this. Then I copied your content on my setup and I’m getting the expected result (there are no h4 and h5).

Check this test too http://savingantiquities.mystagingwebsite.com/content-demo-test/ seems it only happens on that particular content of yours on that particular page. I Suggest to recompose your content by copying every part of each shortcode.

Thank you.

[safesiteParticipant]

The text at the bottom of the page assigned h4 and h5 you saw is what I put down to remind me what to type to put in later on the page. I don’t plan to use h4 or h5. I now deleted it to avoid confusion.

Do you mean I need to start from scratch? Do you advise me to set it up the same way: each line of text in its own text box? Can the larger text and the smaller text go in one text box? How do I remove the large gaps between the large texst and the smaller ones underneath? Or is there a better way to set up large text above smaller text without so much space in between?

Thanks,

[RadModerator]

Hi Cindy,

Nice one! No need to start from scratch since you already removed that area.

About the gap, don’t use <p></p>, just use <div></div> for text block or <span></span> for inline text.

<p></p> add these spaces, the more bigger font size, the larger space.

But if you still wish to use <p></p> then use it like this <p class="man"></p> to remove spaces.

Thank you.

[safesiteParticipant]

Thank you. It took a while and I built the whole thing using VC. I am very code-shy, but I’m rather pleased with the result, except for this pesky space issue. When you say “gap”, I use gap features twice on the page on each side of MAKE A DONATION. Since I’m a real novice, do you mind showing me one example (please use GET INVOLVED and LEARN WITH US…WORK WITH US…MAKE A DIFFERENCE so I can follow) how I should do this and I can follow suit throughout the site:

About the gap, don’t use <p></p>, just use <div></div> for text block or <span></span> for inline text.

<p></p> add these spaces, the more bigger font size, the larger space.

Much obliged,

[ChristopherModerator]

Hi Cindy,

It seems that provided URL is not available .
Please provide us with correct URL ,So we can offer you better solution.

Thank you.

[safesiteParticipant]

This reply has been marked as private.

[ZeshanMember]

Hi Cindy!

Thank you for writing in!

I have added a CSS class of mbn to the heading “Get Involved” (see: http://prntscr.com/4in2an), it should not having any gap beneath it. Please do the same with other elements and it should be working just fine.

Hope this helps. 🙂

Thank you.

[safesiteParticipant]

What I see is “man” and in the screenshot provided, but in any case I tried “mbn” and both look the same, there’s still a lot of space between GET INVOLVED and LEARN WITH US…WORK WITH US…MAKE A DIFFERENCE below it.See https://www.dropbox.com/s/ot0v9e8ottdnj8z/Screen%20Shot%202014-09-01%20at%204.04.41%20PM.png?dl=0 Is this the closest these 2 lines can get? Did I miss something?

Thank you.

[ZeshanMember]

Hey Cindy,

You can use “man” or “mbn”, it will work the same. Regarding the height, it’s simply a line-height, to clear it, simply add the following CSS code under Custom > CSS in the Customizer:

p.mbn, p.mvn, p.man {
   line-height: normal !important;
}

Hope this helps. 🙂

Thank you.

[Author]

Posts