Div изменение размера / адаптация

0

У меня проблема, и я не могу ее обойти.

В основном я хочу, чтобы мое меню и мой текст изменялись с изменением разрешения/увеличением/увеличением; изображения работают отлично, контентные div работают нормально, просто меню кажется невозможным адаптировать.

Пожалуйста, помогите мне с этим..

Обычный вид: http://s17.postimg.org/ngj8k0skv/norm.jpg

Увеличенный вид:

http://s17.postimg.org/p729lia3z/notnorm.jpg

Меню выглядит следующим образом:

<a href="nissan-s13-project.html" title="The Project">The Project<span class="desc">Full description</span></a>

и CSS для этого

a .desc {
    display: none;
    text-transform: lowercase;
    font-size: 1em%;
    color: #FC0;
    max-width: 100%;
    z-index: 1;
}

a:hover .desc, .active .desc {
    display: block;
    font-size: 1em;
    max-width: 100%;
    z-index: 1;
}

Я действительно не знаю, что еще делать.

О, и текст выглядит так:

#content p {
    margin: 1.2em 1.2em 2em 1.2em;
    font-size: 0.8em;
    line-height: 1.8em;
    max-width: 100%;
}
Теги:
resize
responsive-design
menu

1 ответ

0

Вам нужно, чтобы ваш текст не изменялся при масштабировании. Но это трудно получить, а не удобство для пользователя (если кто-то хочет изменить размер страницы, вероятно, потому что ему нужен больший текст). Читайте здесь почему: Как запретить пользователям изменять размер шрифта на моем веб-сайте?

  • 0
    Хорошо, но меню все еще нуждается в изменении размера, это похоже на дерьмо таким образом ..
  • 0
    Да, но увеличение масштаба нарушает дизайн большинства веб-сайтов, и пользователи обычно знают это. В любом случае попробуйте удалить #content p {max-width: 100%;}. Это должно позволить р выйти за пределы размера окна. Если это не работает, попробуйте удалить другие max-width или width: 100% контейнеров меню.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню