Hi Ismael,

Any suggestions yet? My client is pushing to get this live end of day today, any chance of it happening?

Thanks
Lyse

Hi Andy
I use their tools they provide to purge all cache and server cache. I see the changes only after a few minutes. I do this purge often so have not experienced too much of an issue with seeing my changes

Usually I would work on the staging, where there is no cache but I just published this past Sunday so trying to quickly get the mobile display issues working

Thank you
Lyse

Hi Andy,

My website is on the product side now just waiting for issues to be resolved with the sliders captions, then I’ll release it.

All of the latest CSS changes are on the production side at the URL I provided you with. I have resetted the password, login with it successfully, so please try again.

Thank you for your patience
Lyse

Hi Nikko,

The cache is control by WP Engine, I have a tool to purge all cache and also clear cache. I use both all of the time.

I see the code is there, but still not lining up the buttons on the ipad device.

Thanks
Lyse

Hi Ismael,

Just created desktop and mobile sections on both pages. All looks like I want so far except for when I flip the ipad horizontally. It does use the mobile version. What should I change in my CSS code that would force the landscape mode on my ipad to display like in portrait mode. I reduced my screen size from 1024px to 989px but it did not fix the issue.

Here’s my code:
/* alternate Releve entreprise grid for mobile devices */
@media screen and (max-width: 989px) {
#releve-entreprise-desktop { display: none !important; }
#releve-entreprise-mobile { display: block !important; }
}
@media screen and (min-width: 989px) {
#releve-entreprise-desktop { display: block !important; }
#releve-entreprise-mobile { display: none !important; }
}

/* alternate Releve leaders grid for mobile devices */
@media screen and (max-width: 989px) {
#releve-leaders-desktop { display: none !important; }
#releve-leaders-mobile { display: block !important; }
}
@media screen and (min-width: 989px) {
#releve-leaders-desktop { display: block !important; }
#releve-leaders-mobile { display: none !important; }
}

/* COACHING PAGE */
/* alternate Coaching travail grid for mobile devices */
@media screen and (max-width: 989px) {
#coaching-travail-desktop { display: none !important; }
#coaching-travail-mobile { display: block !important; }
}
@media screen and (min-width: 989px) {
#coaching-travail-desktop { display: block !important; }
#coaching-travail-mobile { display: none !important; }
}

/* alternate Coaching partenariat grid for mobile devices */
@media screen and (max-width: 989px) {
#coaching-partenariat-desktop { display: none !important; }
#coaching-partenariat-mobile { display: block !important; }
}
@media screen and (min-width: 989px) {
#coaching-partenariat-desktop { display: block !important; }
#coaching-partenariat-mobile { display: none !important; }
}

Thanks
Lyse

Hi John,

Here’s a screenshot of how my client sees the home page sliders:

on iphone 5 : https://www.dropbox.com/s/ii7myi2sbtyzzm0/slider%20caption%20client%20iphone%205.PNG?dl=0
on iphone5S : https://www.dropbox.com/s/q295vlyt0441idp/slider%20caption%20client%20iphone%205S.PNG?dl=0

I also have similar issues on my iphone 6S

Thanks
Lyse

Hi
I realized I have the id entered incorrectly (I had entered a “.” instead of a “#” before), so here’s the revised code:

/* alternate Releve slider image for mobile devices */
@media screen and (max-width: 1024px) {
#releve-slider-desktop { display: none !important; }
#releve-slider-mobile { display: block !important; }
}
@media screen and (min-width: 1024px) {
#releve-slider-desktop { display: block !important; }
#releve-slider-mobile { display: none !important; }
}

But this change seem to have caused both of these to display now…

Where did I go wrong?

Thanks
Lyse

Hi Basilis,

Cache is control by my host WP Engine

Lyse

Hi Andy,

I added !imortant to all elements because nothing was changing. Once reuploaded, I saw the margin top change but the content still displays across the image…

Thanks
Lyse

my client’s is iPhone 5

Hi Any,

What I want is for the text not overlap the person in the images like on the desktop and ipad. So I’m not sure it’s the top of the element that needs repositioning. The text should be restricted in width and wrap to the next line.

Thanks
Lyse

Hi Nikko,

I purged my server cache and purged all cache. I replaced the CSS code but no change on my iphone. So I modified the background color of the sections, saw the change immediately and noticed the down arrow worked. So I put back my original color and once the cache cleared again, all section titles word perfectly!

Thank you so much for all of your time and patience.
Have a great day!
Lyse

Hi
When I change the width of the following CSS element to 30% on my page, I see all of the icons resizing to what I would look like on my iphone:
.flex_column_table{
display: table;
table-layout: fixed;
width: 30%!important;
}

Could this be the element to target? I did try in my child theme custom styles.css but it’s not being applied.

Just trying different scenarios and I need this fixed soon.

Thanks
Lyse

Hi John

I removed all of the CSS I did for the media sections and put back Jordan’s CSS code snippet into my custom styles.css file in my child theme where all of my cutomized CSS code is.

Lyse

Hi John,

What rule did you want me to remove?

Lyse