Way to copy column with settings?

Hi,

I believe I’m using your built-in template for these columns and they have certain effects I cannot seem to replicate. Like the rounded corners and how the text stays in the middle in a formatting option, I can’t seem to get. I have tried duplicating elements and dragging them over but it doesn’t seem to follow the same pattern.

My goal is to create a 4th column for the “$35” option so it doesn’t look so cramped. Along with this, I would like to have them all end at the same length as it always seems their height is a few pixels different in a full screen chrome browser.

Link: https://212tech.net/services
/

Hi @AK49_Logan_907,

You are on the right path by duplicating elements. Those round corners and text alignment are properties by the columns. Inspect the column, there are settings to achieve it. We can copy the settings and we don’t need to set it one by one.
To do it:
1.) Inspect the column the third column.
2.) Click the Save Preset button. Add the name then hit save.
3.) Inspect the fourth column. Click Apply preset button.

To make all columns the same height, please check this detailed guide.

Hope this helps.

Hi, thanks your tip for saving the preset worked. I though I tried that but it looked grayed out so I guess not!

Your article about making the columns the same height is a bit confusing for a beginner… Am I suppose the put the “equal-height” class on each column or the row? Same thing with the CSS alternative code? I tried these both but nothing seemed to happen.

Thanks for the help again!

Hello @AK49_Logan_907,

Please insert the class “equal-height” in your row settings and then use this custom JS code:

(function($){
	$(window).on('load resize', function() {
	var max = 0;
	$(".equal-height .x-column").each(function(index, el) {
		if( $(this).outerHeight() > max ){
			max = $(this).outerHeight();
		}
	});
	$(".equal-height .x-column").css('height', max);
});
})(jQuery);

We would love to know if this has worked for you. Thank you.

I don’t think so. :frowning: But I appreciate the help, hopefully we can figure this out.

I did click run on the JS query but it never changed any sizing.

Okay so I refreshed it in another browser and it looks like it is the same line size now. A few things though:

  1. How do I get the buttons to stay at the bottom in line to like the 3rd column?

  2. There seems to be an issue with a few cornerstone settings. For example in cornerstone the text is white and has been so for over a year but now it’s automatically black. Even when I change the text to white it stays black in the Header element.

I circled the spots where it’s having the issue even though on the cornerstone editor it shows it’s white (formatting is gone too), even after saving and refreshing the page. Any ideas?

The image without the red circles is from the cornerstone editor. It’s pluasable it’s cached I suppose which is why they don’t appear inline.

Sorry for all the updates. Just want to help in case this sheds more light on what is going on. I just logged out and cleared all cookies. Went back to the cornerstone editor and everything looks fine but on the live page there are still off colors and formatting as shown above.

Glad to hear it’s now sorted, @AK49_Logan_907. Cheers!

Hi Jade I think you misunderstood me. Although the columns are in line there are elements that look different in cornerstone than on the live site.

As you can see these images should be exactly the same but there are element differences in each even though they are both live. Why is this?

Current Site: https://212tech.net/services/

Cornerstone current view:

The website should look like the cornerstone view, as that’s the way I designed it.

Hello @AK49_Logan_907,

The column heights are equal now. This does not mean that when the column heights equal, the elements in each of the columns will also align. Please be advised that the default column heights will came from the heights of all the elements inside of each column. To align the buttons in the same line, you will have to re-structure your elements. You will have to insert a row element in each column and then insert those headlines right above the button. You will then set a minimum height for the row setting to make sure that they all have equal height and that the buttons below it will be aligned.

If this is not working for you, please provide us access to your site so we can edit your columns.

Thank you in advance.

Hi,

Sorry if I’m not being super clear. Please look at the image below you can see in cornerstone the view is different from the live site. Please advise per colors and text placements in the green circle.

Thank you!

Hi @AK49_Logan_907,

Our apologies for the confusion. Would you mind providing us with the admin access to your site in a Secure Note so that we can check it:

Hello @AK49_Logan_907,

Regretfully we cannot do anything with your services pages because the given credentials has a very limited user privileges. Could you please at least make it as an administrator so that we can edit the page and correct the element structure?

What happen here is that, the text headline “A plan for everyone.” is wrapped with a <p> tag and it is not necessary because the headline is using h2. You must keep in mind that you cannot nest <p> tag inside a heading tag and that is also the same that you cannot nest <p> tag inside a <p> tag. It is not valid html and will messed up the page.

If it is a heading, it should use a heading tag. The same goes with the paragraph.

Please edit your page and made sure to correct the headline and sub headline texts.

Any broken code you insert in one of texts or headline will messed up the final live view of the page.

Please let us know how it goes.

Sorry I have fixed the account. You should have access to everything you need.

I will try to work on this more and look at the notes you provided.

Thank you!

Hey @AK49_Logan_907,

Now that I have administrator access, I went ahead and edited page. I removed all the unnecessary tags you have added in the headline elements in that section. It should be fixed now.

Check your site again.

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