Why isn’t my stylesheet working on iPhone

[Bluej]

Can you look at this site:
http://capehornstrategies.com
with stylesheet:
‘http://www.capehornstrategies.com/wp-content/themes/capehorn/style.css

Child theme based on Thematic.

The stylesheet is responsive when resizing the browser window.

But on iPhone the @media queries aren’t being activated. iPhone just shrinks the full page down to fit.

I am just not seeing where the problem is — any ideas?

Thank you

[TheDoc]

Try adding this to your template:

[TheDoc]

Using that code tells the smartphone to use its own device width, not the width of your regular styles.

I *think* that should solve it!

[Bluej]

TheDoc
I just tried adding your meta tag and it worked perfectly:

//add meta tag for responsive styles on iPhones

function add_iphone_meta() { ?>

‹meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"›


}

add_action('wp_head','add_iphone_meta');

[Bluej]

Thanks again TheDoc — it really works.

[Kitty Giraudel]

What’s the point of adding it with JS/PHP?

[Bluej]

I like to have a function add it to all headers automatically. Otherwise I have to remember to add manually if have more than one template or doctype for WordPress

[ebinezer]

I used this function in wordPress site . but error message will be display. The error message is “Call to undefined function add_action() ” . What can I do?.

[Author]

Posts