Metro site on ipad

Community Forums Forums Design Tips and Tricks Metro site on ipad

This topic is: not resolved

This topic contains 1 reply, has 2 voices, and was last updated by  David Chu 2 years, 7 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #33296


    I have just moved my site over to the Metro theme and it looks great on a PC but on an Ipad it doesn’t quite fit.

    the header is a bit to wide and i have a youtube video in the featured page inserted as a text/html widget

    This takes over most of the page.

    What is the best way to make sure my site looks ok on the ipad as more and more of my visitors are using ipads now and I fear I am turning them away?




    David Chu

    Hi Roger,
    That’s cool stuff you’re doing there!

    One thing, I think, is fairly quick. YouTube code generally consists of iFrames. These don’t behave all that well. :-) But you can control it to an extent. Try this bit of CSS to keep its width adapting to the size of the device:

    iframe {
      max-width: 100%;

    Headers are always a bit trickier, usually involving some hands-on experimentation. I just went through that on my own site, and had to play for quite awhile to get it working. One idea would be to shrink the title text at the iPad media size or so. And then maybe more fiddling to get the image to respond as well. But this may be a start:

    #title a {
      font-size: 80%;

    Cheers, Dave

    Dave Chu ยท Custom WordPress Developer – likes collaborating with Designers

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.