Service size box

Hi,

When i resize my page, the service boxes (grey background) are not the same size any more. Is there any way to keep them the same size when resizing the page?

Regards
Elie

maratataki.com

Hello Elie,

It is possible, but this task requires some coding and testing, so this goes beyond our support policy. It’s considered advanced customization.

As an option, you can contact Codeable for this kind of service, or find a freelancer on Upwork.

Kind Regards, Roman.

Hi again Roman,

Ok, can i make them transparent to avoid this problem?

Regards
Elie

Yes Elie,

You can make them transparent to avoid this problem.

Please try to use the following CSS code.

You can add CSS code to your site with Simple Custom CSS plugin (just copy CSS code and paste it in Dashboard → Appearance → Custom CSS after installing and activating the plugin). Also you can add CSS code directly to style.css file of your child theme.

.service {
    background: none;
    border: none;
}

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.

Hi Roman,

Unfortunately this code doesn’t work… the grey boxes in the “services” of my from page remained the same…

Regards
Elie

Hello Elie,

I don’t see that you applied the code. Can you please tell me how exactly you added it to your website?

Kind Regards, Roman.

Hi Roman,

I just added the code to the Custom CCS the way you described it… when i saw that it does not work, i removed it, now i added it again… and no change…

Regards
Elie

Okay Elie,

Please try this instead:

.service {
    background: none !important;
    border: none !important;
}

Kind Regards, Roman.

Hi Roman,

Yeap, this works. Now I need to change the “read more” colour, can I? and i guess I should replace “service” with “employees” to remove the “Employees” service boxes?

Thanks and Regards
Elie

Please try this to make Read more color white:

.service a {
    color: white;
    font-weight: bold;
}

font-weight: bold; part is optional (it can help you to make the link more noticeable).

And this is similar code for employees:

.employee {
    background: none !important;
    border: none !important;
}

.employee-desc {
    border: none !important;
}

.employee a {
    color: white;
    font-weight: bold;
}

Kind Regards, Roman.

Thanks Roman… works great…

You are welcome Elie,

And have a nice day :slight_smile:

Kind Regards, Roman.