CSS Issue - Site not displaying properly on iPhone & iPad

Hi all,

I have an issue with a website - lawnresponse dot com.

I have a ‘customer feedback’ carousel that displays a few bits of information. This works fine on desktop, mobile and tablet on android devices, but on iphone and ipad the backgroind is all white and the text isnt visible etc.

Can anyone please advise why? I have looked at the code but cant see the issue.

Any help is very much appreciated.

I can’t duplicate this on my ipad, nor on any iphone emulators. Can you provide a screenshot?

What version is that?

Only thing I can think of is the way you’re dealing with the html tag is hosing it (there won’t be one for anything non-ie since conditional comments are ignored totally).

Never mind - I see the closing comment (not sure why you have this here at all…)

Edit: I did a validation of your html, and you’ve a number of errors which need to be resolved. These may resolve some of the issues as well: https://validator.w3.org/nu/?doc=http%3A%2F%2Fwww.lawnresponse.com%2F

The css validator is throwing a bunch of errors as well. Some look like MS specific, older hackish css, but you should look at those as well: http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.lawnresponse.com%2F&profile=css3&usermedium=all&warning=1&vextwarning=&lang=en

Thanks Dave,

I have worked through the HTML errors and got most sorted. Now looking at CSS. Lots of issues here.

Should I now remove all instances of the old css precursors e.g. things like -webkit-transform
Are these all outdated now? Today should it just be simply transform:

?

Not if you want to support older browser versions. Those will still use the pre-cursors

I fixed the HTML errors and it still didn’t help :confused:

Any other ideas?

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.