2016-02-03 1 views
0

Может ли кто-нибудь помочь мне здесь? Я хотел использовать навигационную рамку сверху и загружать сайты на основной кадр ниже.Невозможно изменить размер навигации сверху, несмотря на все попытки

Все работает!

Но я не могу заставить его масштабируется, если я уменьшить/изменить размер окна на нечто иное, чем весь экране,

Пробовал CSS- запас, отступы, используется совершенно новый веб-сайт без див, чтобы попытаться получить от нуля, установить фрэймы относительного размера, но навигация исчезает, как только я свести его к минимуму, несмотря на все усилия,

фреймов на index.hmtl:

<frameset rows="*,3*" cols="1" framespacing="" frameborder="no" bordercolor="#D8D6DB"> 
    <frame src="menu.html" name="menu" frameborder="no" scrolling="no" > 
    <frame src="home.html" name="main" frameborder="no" scrolling="yes" > 
</frameset> 

навигация

h1 id="logo"><a href="home.html" target="main">CFS ME Therapie</a></h1> 

nav id="nav">     


li> 

li><a href="home.html" target="main">Startseite</a></li> 

li><a href="therapie.html" target="main">Therapieansatz</a></li> 

li><a href="leistungen.html" target="main">Leistungen</a></li> 

li class="break"><a href="praxis.html" target="main">Praxis</a></li> 

li><a href="qualifikation.html" target="main">Qualifikation</a></li> 

li><a href="kontakt.html" target="main" >Kontakt</a></li> 

CSS

/* Заголовок */

#logo { 
    position: relative; 
    z-index: 1; 
    top: 3px; 
    left: 50%; 
    width: 260px; 
    margin-left: -7.5em; 
} 

#logo a { 
    display: block; 
    width: 100%; 
    height: 4em; 
    line-height: 4em; 
    background: rgba(255, 255, 255, 0.15); 
    border: solid 1px; 
    border-color: #fff; 
    border-color: rgba(255, 255, 255, 0.75); 
    border-top: 0; 
    border-radius: 0 0 0.35em 0.35em; 
    color: #fff; 
    display: inline-block; 
    letter-spacing: 3px; 
    text-align: center; 
    text-transform: uppercase; 
    font-size: x-large; 
    font-weight: bold; 
    alignment-adjust: middle; 
    margin: auto; 
} 

#nav { 
    text-align: center; 
    position: absolute; 
    top: 60px; 
    left: 0px; 
    width: 100%; 
    height: 4em; 
    line-height: 4em; 
} 

#nav > ul { 
    margin: 0; 
} 

#nav > ul > li { 
    display: inline-block; 
    margin-left: 1em; 
} 

#nav > ul > li > ul { 
    display: none; 
} 
#nav > ul > li > span, #nav > ul > li > a { 
    color: #fff; 
    text-decoration: none; 
    outline: 0; 
    border: 0; 
    border: solid 1px rgba(255, 255, 255, 0); 
    border-radius: 0.35em; 
    padding: 0.3em 1em 0.3em 1em; 
    -moz-transition: border-color 0.25s ease-in-out, background-color 0.25s ease-in-out; 
    -webkit-transition: border-color 0.25s ease-in-out, background-color 0.25s ease-in-out; 
    -o-transition: border-color 0.25s ease-in-out, background-color 0.25s ease-in-out; 
    -ms-transition: border-color 0.25s ease-in-out, background-color 0.25s ease-in-out; 
    transition: border-color 0.25s ease-in-out, background-color 0.25s ease-in-out; 
} 

#nav > ul > li.active > span, #nav > ul > li.active > a { 
    border-color: rgba(255, 255, 255, 0.75); 
    background-color: rgba(255, 255, 255, 0.15); 
    color: #fff; 
} 
#nav > ul > li:first-child { 
    margin-left: 0; 
} 

#nav > ul > li.break { 
    margin-left: 20em; 
} 

ответ

2

Ваш HTML сломана. Также использование <frame> и <frameset> устарело.

Вы можете прочитать о чувствительных вставках here.

1

<frameset> и адаптивный дизайн из разных эпох - фреймы не просто устарели, они официально «несоответствующие характеристики» в HTML5, которые «не должны быть использованы авторами»: https://www.w3.org/TR/html5/obsolete.html#non-conforming-features

Я я точно не знаю, в чем проблема, которую вы видите, - ваш HTML-код каким-то образом искалечен, поэтому я не могу его проверить, но я совершил поездку по ностальгии и проверил комплект фреймов, и он масштабировался просто отлично (согласно его оригинальному правила пропорционального отношения к видимости), где я тестировал его. Но какова бы ни была проблема, вероятно, потому, что разработчики браузеров не прилагают больших усилий для поддержки функций, которые устарели много лет назад.

Смежные вопросы