2012-04-07 8 views
1

問題:jQueryのモバイルNavbarsパディング間違っ:狭すぎる

マイnavbarsがhttp://jquerymobile.com/test/docs/toolbars/footer-persist-a.html

での例ではnavbarsのようなものを見ていない私が間違っているのは何/違いますか?

JSフィドル:http://jsfiddle.net/OpnSrce/dUcUF/

コード:

<!DOCTYPE HTML> 
<html> 
    <head> 
     <meta charset = "utf-8"> 
     <meta name = "viewport" content = "width=device-width, initial-scale=1"> 
     <title>AD&amp;D Spellbook</title> 
     <style> 
      @import url('http://code.jquery.com/mobile/1.1.0-rc.2/jquery.mobile-1.1.0-rc.2.min.css'); 
     </style> 
     <script src = "http://code.jquery.com/jquery-1.7.1.min.js"></script> 
     <script src = "http://code.jquery.com/mobile/1.1.0-rc.2/jquery.mobile-1.1.0-rc.2.min.js"></script> 
    </head> 

    <body> 
     <div data-role = "page" data-theme = "b"> 
      <div data-role = "header" data-position = "fixed" data-theme = "b"> 
      </div> 
      <div data-role = "content" data-theme = "b"> 

      </div> 
      <div data-role = "footer" data-position = "fixed" data-theme = "b"> 
       <div data-role = "navbar"> 
        <ul> 
         <li>All Spells</li> 
         <li>Memorized Spells</li> 
         <li>Known Spells</li> 
        </ul> 
       </div> 
      </div> 
     </div> 
    </body> 
</html> 

答えて

2

[OK]を私は私の答え最初のバージョンが間違っていた変更。あなたの足には<a>というタグがありません。

<div data-role="navbar"> 
    <ul> 
     <li><a href="">All Spells</a></li> 
     <li><a href="">Memorized Spells</a></li> 
     <li><a href="">Known Spells</a></li> 
    </ul> 
</div> 
関連する問題