PDA

View Full Version : Logo will not resize for iphone in wordpress


cocoonfx
12-12-2011, 10:12 PM
Hi Chaps

I have got a wordpress site with a logo which does not want to resize when you rotate iphone when in Portrait. The original image is 470px by 80 px height.

I have in the theme header.php the following


<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0">
<link media="only screen and (max-device-width: 480px)" href="<?php echo bloginfo('template_url'); ?>/iphone.css" type= "text/css" rel="stylesheet" />

The logo site in its on div

<div id="logo"><a href=""><img src="<?php echo get_template_directory_uri();?>/images/AHlogo.png" width="471px" height="80px" alt="" title=""/></a></div>

How do I get the logo to resize.

I also want to resize the image in the banner area from 1000 px by 288 px to fit in proportion in portrait and landscape on iphone.

The url for the site is http://www.test-cocoonfxmedia.co.uk/dev

gentleone
12-15-2011, 05:12 PM
You will have to remove the width and height attributes from the logo img tag in order to resize images wth percentages in the css.

In your css you should have then something like this to let the browser do the resizing.

img {max-width: 100%}