Safari/webkit issues with employees


#1

Hello everyone,

I am have 2 issues with the employees section/widget.

1: when using safari (mac version only, using 10.10) or on an iOS device, when I hover over the employee images (which should show their name and social media links) The highlight color works fine, but the name and social links appear normal for the fade in, then they jump up the image almost out of view. Works fine in all other browsers and in safari for windows. Any idea if this is an issue with the base CSS for the theme that is webkit specific?

2: I only have 3 employees to list, but the theme seems to automatically leave a gap for the 4th. On a smaller screen like tablet or phone, this isn’t an issue because it only shows 1 or 2 but on a desktop computer, it looks like I have 3 of them off to the left and an empty gap on the right. I tried setting the “number of employees to show” to 3, but same issue. Is there a way to auto center this when the number of employees is less than 4?

Thanks again!


#2

Hey,

  1. I see what you mean on iPhone. The issue is more Safari specific than webkit specific. I’ll try to find a fix - it will take some time as I don’t have a Mac.

  2. The theme carousel shows 3 employees by default. See our demo page. Can you post a link to your website?


#3

So I got a fix for the Safari thing, seems to work fine on iphone. Use this at the bottom of your style.css for now:


.roll-team .team-item .team-pop .team-info {
       top: 30%;
       position: relative;
       -webkit-transform: none;
       -moz-transform: none;
       -ms-transform: none;
       -o-transform: none;
       transform: none;
}


#4

Hello Vlad! Thanks for the fix… but there is a new issue. It works now on Mac version of safari, but now the PC version is broken lol. The text ends up WAY below the employee image. The other browsers work fine. I tried to use position absolute, which fixes safari but breaks all other browsers (their text does not line up). I used to code HTML and CSS by hand and I know that cross-browser sucks… I really appreciate your help.

I would prefer to PM you the site address if possible as there are still unreleased details about a product we are working on. As for the employees showing 4 spaces, I wonder if it might be the images I am using height/width issues?

Let me know what you find, and thanks again


#5

I also found this: http://stackoverflow.com/questions/2838664/how-to-target-safari-for-mac-only

I will try to implement and see what happens


#6

Hello again Vlad, not sure if this helps, but if I resize my window, the 3 employees center themselves. my monitor is 1650x1050, not sure if this is an odd ball size, but it looks the same way (a 4th empty area) on many monitors at work too


#7

The PC version of Safari is 3 years old and is no longer maintained. Don’t worry about it unless you have a really good reason.

Send me your link to vlad[at]athemes.com please. Still can’t understand what you mean about the employees. You do see three at a time on our demo page?