Align Blocks In Height And Width Image Layout - Question | JoomShaper

Align Blocks In Height And Width Image Layout

WD

Web designer

SP Page Builder 2 weeks ago

Good afternoon! Can you please tell me how to correctly align the blocks in height and width of the Image Layout? .row rule { display: flex width: 400px height: 900px; } !important Does not work!

0
34 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

Hi

Thanks for contacting us. Could you please give me your site URL and also screenshot of your issue?

-Regards.

0
WD
Web designer
Accepted Answer
2 weeks ago

Good afternoon! I want all blocks to display the same height regardless of text size. I wrote the code for this, but it doesn't work. .row { display: flex width: 400px height: 900px; } !important What to do? Attached is a screenshot of the blocks on the site.

0
WD
Web designer
Accepted Answer
2 weeks ago

Can you help me?

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

Hi,

Sorry for the delay. Please follow this documentation below:

https://www.joomshaper.com/documentation/sp-page-builder/sp-page-builder-2-x/how-to-use-columns-equal-height

It may help you. If you need again help please share your site URL so that I can check.

0
WD
Web designer
Accepted Answer
2 weeks ago

I have completely dispersed blocks. I have completely dispersed blocks. Look please!

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

Hi,

Use this custom CSS

.sppb-addon-image-layout-content{
    height:900px !important;
}

Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

0
WD
Web designer
Accepted Answer
2 weeks ago

Excellent. Only I reduced the height to 600 and everything began to display correctly But the blocks where there is little text suffered and they became huge in height. Look please. Screenshot is attached.

0
WD
Web designer
Accepted Answer
2 weeks ago

please tell me there is a solution to this problem?

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

Just reduce the hegiht then everything will be alright. Delete my previous code and use this one.

.sppb-addon-image-layout-content{
    height:500px !important;
}
0
WD
Web designer
Accepted Answer
2 weeks ago

I already did this, the text does not fit into blocks then. And those without text get very large as before.

0
WD
Web designer
Accepted Answer
2 weeks ago

Could you invite a specialist who can help me?

0
WD
Web designer
Accepted Answer
2 weeks ago

I enabled the option on your advice. The blocks did not become equal in height. Made them tall. Nothing works. On another site, I wrote the code for the block of features and only after that the blocks became equal. With this kind of blocks, I can't do anything. Your advice doesn't work. Screenshot proof that I included vertical alignment for the blocks in the section. I need help. Invite, please, a specialist who can help me.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

Give me your super admin access please.

0
WD
Web designer
Accepted Answer
2 weeks ago

Good. I give

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

Hi,

Please check now I have fixed the issue.

https://prnt.sc/-kJfjHTxKkQg

0
WD
Web designer
Accepted Answer
2 weeks ago

Thank you, of course, but I told you yesterday that this method is not suitable. Look at my screenshot, where you can see that the text has crawled out of the block border. It should not be.

0
WD
Web designer
Accepted Answer
2 weeks ago

Thank you, of course, but I told you yesterday that this method is not suitable. Look at my screenshot, where you can see that the text has crawled out of the block border. It should not be.

0
WD
Web designer
Accepted Answer
2 weeks ago

Thank you, of course, but I told you yesterday that this method is not suitable. Look at my screenshot, where you can see that the text has crawled out of the block border. It should not be.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

Which page you are facing this? Because it seems ok on my end I was also sending you the screenshot. By the way now check please and let me know.

0
WD
Web designer
Accepted Answer
2 weeks ago

Thank you, of course, but I told you yesterday that this method is not suitable. Look at my screenshot, where you can see that the text has crawled out of the block border. It should not be.

0
WD
Web designer
Accepted Answer
2 weeks ago

now 1 block below the others

0
WD
Web designer
Accepted Answer
2 weeks ago

I need help. Invite, please, a specialist who can help me.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

Did you check properly? Please clear your browser cache and check again. Dont you think I am specialist??

0
WD
Web designer
Accepted Answer
2 weeks ago

I have updated the browser cache. See how much empty space has formed and how ugly everything looks

0
WD
Web designer
Accepted Answer
2 weeks ago

I need help. Invite, please, a specialist who can help me.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 2 weeks ago

This is the only solution. Further then we have nothing to do. I am also talking with other specialist they also said that.

0
WD
Web designer
Accepted Answer
1 week ago

Well, if so, then I will no longer extend your expensive component! If it is so unadapted for the normal display of blocks.

0
WD
Web designer
Accepted Answer
1 week ago

If you consider such a display of blocks, as in the screenshot, to be normal, then I don’t need such a component! I won't pay for it anymore.

0
WD
Web designer
Accepted Answer
1 week ago

And so the result: The instruction that you gave me the link - https://www.joomshaper.com/documentation/sp-page-builder/sp-page-builder-2-x/how-to-use-columns-equal-height is not working. So, as each block had to be written manually, so that each block had a fixed height and it was displayed correctly. The rule that I sent you does not work for this block, but only for the features block. There I had to manually write the code: .row { display: flex width: 400px height: 900px; } so that the blocks are the same height. Can you change the instructions? Why give something that doesn't work in the end?

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 week ago

If I may...

without using any extra CSS >> https://www.youtube.com/watch?v=acZCjxEB3K4

old but still current tip (!) from my channel

0
WD
Web designer
Accepted Answer
1 week ago

Thank you very much for answering. I watched your video, but as I wrote above, this method does not work.

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 week ago

worked for me

0
WD
Web designer
Accepted Answer
1 week ago

your specialist had access to my site and saw that this method did not work. Therefore, they applied css

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 week ago

I saw on your homepage that you have already equal-height columns with "English Breakfast, Mint...."

You set height value, maybe it's not perfect solution but if works.

0