Ipad and Iphone Scaling issues

  • Hello – could someone knowledgeable please help an idiot like me with my website https://www.facialacupuncture.org.uk/devonacu/wordpress/ which works fine with all browsers until I looked at ipad and iphone – it looks awful and everything is scaling differently. Please look at it on a normal web browser first.

    I have tried inserting <meta name=”viewport” content=”width=device-width; initial-scale=1.0; maximum-scale=1.0;”> as found from other threads but this hasn’t done much I can see.

    My background is all out, the font sizes are all weird, (I’m guessing that’s a px v em problem that i’ll have another look at), the header shrinks way too much, the sidebar is at the bottom and the content is too wide for it’s space. Apart from that all is fine!

    Thanks for any help and please be patient with me, I’m a newbie.

Viewing 5 replies - 1 through 5 (of 5 total)

  • That’s tough, because in order to look good in all devices, the theme itself must be designed that way with CSS to be responsive, for example for any CSS definitions for 979 and 480 pixels as an example, the codes for this width definition will look like:

    @media only screen and (max-width: 979px) {
... iPad codes goes here...
}

@media only screen and (max-width: 480px) {
... iPhone codes goes here...
}

    so you probably have to find those blocks and make changes there. If you can’t find them, then your theme isn’t responsive at all.

    Thread Starter localfamilystuff

    (@localfamilystuff)

    Ah thanks for that – just looked up about the theme (PressWorks – but I’ve been modifying it) and it says this in it’s blurb:
    PressWork is a free, open source WordPress theme framework built for modern browsers using HTML5 and CSS3. Features include a drag & drop front-end editor for easy customization, the top 20 most popular Google Fonts and a responsive design using media queries so your site will look good on the iPad, iPhone and other handheld devices.

    So I guess it’s probably something I’ve done…

    Thread Starter localfamilystuff

    (@localfamilystuff)

    No I am deinitely stumped. The header image is shrinking to the width of the main content only, the sidebar is underneath… The page is all tiny and stuck in the middle very oddly.

    Also the ‘main’ font on the index page is so much smaller for the 3 columns than it is for the rest of the page. Weird. I think I am a snadge out of my depth!

    Thread Starter localfamilystuff

    (@localfamilystuff)

    Ah, you are totally right – I have found and started amending the @media section and it’s definitely getting closer with the iphone, although my header is still strange. But thanks for pointing me int he right direction. (for anyone else looking at this forum the file to be amended is actions.php )

    Glad you are going somewhere. That can only be fixed with trials and errors no doubt ??

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Ipad and Iphone Scaling issues’ is closed to new replies.