在iphone上無縫縮放網站標題。

我有一個網站（http://ukchina-trading.com/）與下面的頭：在iphone上無縫縮放網站標題。

HTML

 <div class='leftImage'> 
      <img src='image/unionjack.png'> 
     </div> 
     <div class='title'> 
      <h1>J Plus Trading</h1> 
      <h2>Briding the gap between China and the UK</h2> 
     </div> 
     <div class='rightImage'> 
      <img src='image/chinawings.png'> 
     </div>

CSS

.title h1 { 
    font-family: 'Droid Serif', Georgia, Times, serif; 
    text-align: center; 
    font-size: 68px; 
    line-height: 65px; 
    padding-top: 60px; 
    margin-bottom: 80px; 
} 

.title h2 { 
    font-family: 'Droid Serif', Georgia, Times, serif; 
    text-align: center; 
    position:relative; 
    top:-88px; 
    left:3px; 
    font-size: 16px; 
    color: #FF3300; 
} 
.rightImage { 
    position:absolute; 
    right: 150px; 
    top: 2px; 
} 

.leftImage { 
    position:absolute; 
    left: 150px; 
    top: 2px; 
}

當該網站是在計算機上查看頭被罰款，但當在iphone屏幕上查看時，圖像被推到標題上，隱藏它。

什麼是重做標題來阻止它的最好方法？

來源

2012-12-24 Jamie Fearon

如果添加了'位置：relative'到'.title'格，並賦予其更高的'Z-索引'，至少標題不會隱藏;） –