How to size an Article box on a Landing page

Dear team,

I would like to create a display similar to


on the main page of, for the Groups section. However, the boxes are displayed very large, how can I resize them?


Kind regards,
Katarina Sigerud

Hello Katerina,

A solution could be to make changes to CERN override theme by adding the following code snippet to theme.css file or to a new css file .

.component-preview-cards.portrait .component-preview-cards__box_wrapper {
	height: 180px;
.component-preview-cards.portrait {
	height: 236px;

Let me know if it works,

PS. I am pretty sure that Web Team will provide you with a better solution

1 Like

Hello Katarina,

The size of the boxes can be changed by changing the display of the box. If you want to imitate the configuration of the “Our Achievements” section of home website (the screenshot that you posted) then:

Place them under a section that uses the width “Fluid BG Centered content” and then 5 Article Boxes:

  1. Display: Portrait
  2. Display: Simple
  3. Display: Simple
  4. Display: Simple
  5. Display: Simple

Let me know if that works for you. Ioannis’ solution probably will work but try to avoid changing the theme when there is an option for that.


1 Like

Hi Kostas,

Thank you, that worked! I should have tried that option first before contacting you…

Kind regards,

1 Like


I tried to do something similar to “Key Achievements” section following this article, but I am not sure what I need to do next. If I want to create a view, which display format should I use?

Best regards,

Hi Ioanni,

This can’t be applied automatically in a view as a display format. It’s only for content added manually under a section.

Thank you Sotirios,

I found a solution. I will write an article how I achieved it.

Best regards,

Related to this page I have seen the BE careers section:

I have seen that a calculation with javascript has been added in order to resize the boxes.

Could someone explain where Can I do that in the cade? I need the same for the website

Hey @almudena.solero,

You can see how it is done in my answer on Problems in landing page with Article boxes.

However the solution I provide is NOT about a view using Horizontal Boxes, but for boxes in Landing Pages. Do you really need the content to be dynamic? If not then you can always do it static in the Landing Page using plain Article Boxes. Let me know if you have any question on the implementation.


Thanks for your advise. I will see if I can use horizontal boxes instead ofview…