Classic block grid not resposive

[Foli]

Hello,

I have been trying to get classic grid block to work on cornerstone for a while now. The issue is that I would like to have 3 column blocks and then on mobile screens it would be 1 column.

I have tried to style this with css, but the issue is that It is not responsive with the image and for devices such as tablets or in some cases 13 inch laptops, it gives me a 2-1 (reverse pyramid) styling.
Also the image is the issue. If I make it work for desktop, it looks back on mobile, and if I alter it to work with mobile, it’s bad with desktop.

I am really reaching my limits with this one. I dont understand why grid block is not more straight forward… Or then I am missing something.

Any assistance would be appreciated.

[thai]

Hi There,

Please note that custom coding is outside the scope of our support. Issues that might arise from the use of custom code and further enhancements should be directed to a third party developer.

Please also add this custom CSS:

@media (min-width: 481px) and (max-width: 980px){
    ul#frontpage-services > li {
        width: 32% !important;
        margin-right: 1% !important;
    }
}

If you would like to learn CSS, I am sharing few resources that you take a look to get started with CSS and an interesting tool that you can use to speed up the development process.

I recommend you to watch following video that will help you to get started with CSS.

https://www.youtube.com/watch?v=MFR4WXiLzpc

Sometimes it can get a bit difficult to find out the right selector to be able to write the required CSS codes. A handy tool that can help you in this is Google Chrome dev tools. I am sharing the resource that you can refer to get started with dev tools.

https://developers.google.com/web/tools/chrome-devtools/css/

https://developers.google.com/web/tools/chrome-devtools/

https://www.youtube.com/watch?v=tP_kXBJWPhQ&t=200s

Thanks.

[Foli]

Thank you for the reply and tips. These are helpful.

May I just inquire if it is available to get you guys to assist with tasks that are out of scope for an agreed fee? I am sure I am not the only one that has thought of this.

[mldarshana]

Hi Foli,

Thank you for your interest. Currently we don’t have such services offered within our company, so you need to contact third party services or developer to assist you with custom development requirements.

Thanks for understanding.