Как сделать такой же макет сайта для мобильного

Question

У меня проблемы с сайтом, над которым я работаю. Это сайт here. Верхняя панель навигации не подходит для мобильных устройств/планшетов. Это нормально на рабочем столе. Смотрите изображение мобильного зрения:

Я не хочу, чтобы сделать его отзывчивым, но с мобильного телефона или планшета он должен быть тот же макет с scrooling. В коде для навигации нет проблем. Проблема заключается в том, что ди-джей держат навигацию. Потому что, если я удалю навигации и использовать только текст, он будет иметь ту же проблему:

HTML-код DIV:

<div class="outer top"> 
    <div class="inner"> 
     <div class="nav"> 
      <ul> 
       <li>....</li> 
       <li>....</li> 
       <li>....</li> 
      </ul> 
     </div> 
    </div> 
</div> 

CSS-код:

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { 
    border: 0 none; 
    font-size: 100%; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline; 
} 

body { 
    background: url(../images/bg.png) repeat-x #fff; 
    color: #fff; 
    font-family: Helvetica, Myriad Pro, Verdana; 
    font-size: 14px; 
    line-height: 1em; 
} 

.outer { 
    width: 100%; 
    float: right; 
    display: block; 
} 

.top { 
    background: #004481;  
} 

.inner { 
    width: 940px; 
margin: 0 auto; 
} 

Я использовал ширину 100%. Но, все же, это не нормально на мобильном/планшете. Не могли бы вы дать мне решение ...

Answer 1

Я положил ваш код в jsbin и не смог увидеть, что вы видите. Можете ли вы добавить еще код?

http://jsbin.com/ologix/1/edit

Answer 2

Вы также могли бы рассмотреть, чтобы создать новую таблицу стилей, специфичные для ваших мобильных/планшетных устройств. Это гарантирует, что он будет выглядеть правильно на всех устройствах. Вы уже используете Divs, чтобы это не было проблемой.