Hi,
can I make all symbol boxes (I have three in a row) the same height?
One is not as tall as the other ones, cause there’s less text in it.
Kind regards,
Veronika
Hey Loveronika,
Can you provide a link to the site/page in question so we can look into this issue further.
Best regards,
Jordan Shannon
Hi, please see private reply
a very elegant method is to use the flex box modell:
the align-items: stretch made the trick
put the three iconboxes in a 1/1 container ! give to this 1/1 container the custom class: flex-iconboxes
now put this to your quick css:
/* mediaquery width depends on your settings ( maybe 768px) */
@media (min-width: 990px) {
.flex_column.flex-iconboxes {
display: flex;
flex-flow: nowrap row;
justify-content: space-between;
align-items: stretch;
}
.flex_column.flex-iconboxes::before, .flex_column.flex-iconboxes::after {
display: none;
}
.flex-iconboxes .iconbox {
flex: 0 1 30%;
background-color: #e8e8e8 !important;
border-radius: 5px;
margin-bottom: 0 !important;
}
.flex-iconboxes .iconbox_content {
box-shadow: none !important;
}
}
result see here : https://webers-testseite.de/iconboxes-with-equalheight/
if you got more than 3 boxes play with the 30% value ( 4 boxes : less than 24% ) etc
Thank you Günni,
Jordan, is it possible an easier way?
Hi,
It does not get easier than the css method.
Best regards,
Jordan Shannon