Feature items grid now stacking in Safari

[reimagineart]

Hello,

We recently upgraded our KLEO theme to the latest release and a Feature Items grid on our Home page is now stacking on Safari (desktop) instead of displaying the two boxes side-by-side like they display in other browsers (Mozilla and Chrome).

The only thing we’ve done on our end is apply the released update.

Thanks for your help!

Kevin

[Abe]

Hi there, I tried to reproduce it on my kleo install and couldn’t. Also the demo looks fine.

Can you please disable any others plugins you might have to ensure nothing is interfering?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[reimagineart]

Hello, I just tried what you suggested, and it did not correct the problem. Any other thoughts? The only thing I’ve done to cause the problem is upgrade the theme.

Thanks,

Keviin

[reimagineart]

When you attempted to reproduce, did you set the feature items grid from Default to Box? If I set the grid to default, it aligns correctly in Safari (not an acceptable solution for my needs though).

[reimagineart]

Hi there, any update on this at all?

[deikka]

The same problem here, guys… 🙁

[Abe]

will be take an extra look if you are using the latest theme version.

also please give a link to your page

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[deikka]

You can see this happening here here

Thanks in advance.
A.

[Abe]

Hi, I just managed to see what is causing this and will come back with a fix tomorrow. Thanks for your patience.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[Abe]

Still doing some tests. @deikka I see you changed those and added them to columns with one per row. Will definitely come back with a fix in the next theme update.

@reimagineart what is the page where you have that problem?

Thanks

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

---
@ SeventhQueen we do our best to have super happy customers. Thanks for being our customer.

[reimagineart]

Main home page at: http://reimagineart.com/

[deikka]

ok, @abe, thanks!

[Robert]

Hi, we fixed this and will be available in our next update. Until then we have an workaround for this.

Edit in your child theme app.css as follows:

1. Around line 7026 please remove this line since we don’t need it anymore:

COPY CODE

.box-style, .box-style .one-by-one-animated {
	width: 100%;
}

2. Around line 7099 you have this line:

COPY CODE

.box-style .col-xs-12 {
	display: flex;
}

… You need to change it like this:

COPY CODE

.box-style .col-xs-12 {
	display: flex;
	margin-left: -1px;
}

If this isn’t working for you please let me know.

Best regards,
Robert

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Robert - Front-end developer and UI graphics enthusiast.

[reimagineart]

Thanks @Robert, it worked great.

[Author]

Posts