powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / помогите адаптировать код под NN
6 сообщений из 6, страница 1 из 1
помогите адаптировать код под NN
    #35058568
Есть 5 слоёв:

шапка header
3 слоя тела left,middle,right (подслои слоя main)
низ bottom

В IE всё распологается как надо: bottom слой - под наиболее низким из {left,middle,right}, наезжая на них на 50px
В остальных броузерах bottom позиционируется относительно main. Это неправильно, т.к. main - это контейнер и контентом не заполняется, то есть его высота фиксирована => фиксированной остаётся высота bottom вне зависимости от обьёма контента.

Подскажите, пожалуйста, как сделать поведение слоёв в NN идентичным поведению в IE?

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<style type="text/css">

 #header{width:900px; margin-left:50px; margin-top:10px; height:200px; background:#FFAAFF}
 #main{float:bottom;width:800px; height:500px; margin-left:100px; margin-top:-50px;}
   #left{float:left;width: 20 %; height:200px; margin-top:50px;background:#AA0000}
   #middle{float:left;width: 60 %; background:#00AA00}
   #right{float:left;width: 20 %;height:200px; margin-top:50px;background:#0000AA}
 #bottom{float:bottom;width:550px; height:100px;margin-left:350px; margin-top:-50px; background:# 999900 }

</style>
</head>

<body>

  <div id="header">
  </div>

  <div id="main">
     <div id="left">
     </div> 
     <div id="middle">
         В своїй “Автобіографії” Бертран Рассел писав : “Всю мою жизнь пронизывали три страсти, простые, но неодолимые в своем могуществе: жажда любви, тяга к знанию и мучительное сочувствие к страданиям человечества”.  Ця фраза може слугувати візитною карткою філософа, в ній – весь сенс життя Рассела, його переконань і світосприйняття.
         Бертран Артур Уільям Рассел народився  18  травня  1872  року в аристократичній англійській родині. Його батько, віконт Емберлі, був третім сином Джона Рассела, лідера вігів, що обіймав пост прем’єр-міністра Великої Британії в  1846 - 1852  і  1865 - 1866  роках. Наприкінці  1889  р. Рассел поступив в Трініті-коледж(Кембридж), де навчався з жовтня  1889  року по червень  1894 –го і як наслідок отримав чудову освіту в галузі математики й логіки. В ці роки він захоплюється математикою, логікою, філософією, в  1896  році пише докторську по геометрії і невдовзі стає визнаним вченим; в  1908  р. його приймають в Королівське наукове товариство.  Походженню Рассел має завдячувати непохитним переконанням в своєму праві на голос. Він сприймав як належне свою можливість доступу до представників уряду і мав впевненість в тому, що до його думки будуть прислухатися. Це стало основою активної суспільно-політичної діяльності Рассела, апогеєм якої став період Першої світової війни. Сам він так описує зміни, що відбулися в його свідомості          в цей період: “Я вынужден был пересмотреть свои взгляды на человеческую природу... ... ... Раньше я полагал, что любовь к своим детям - естественное родительское чувство, но война убедила меня, что оно встречается крайне редко ... ... ... До тех пор я думал, что большинство интеллектуалов любит истину, но вот вновь обнаружилось, что едва ли десять процентов из них предпочитают правду собственной популярности”. 
        <BR><BR><BR><BR><BR>
     </div>
     <div id="right">
     </div>
  </div>

  <div id="bottom">
    op[o[o[pp[o[pop[opo[
  </div>
</body>

...
Рейтинг: 0 / 0
помогите адаптировать код под NN
    #35058574
apapacy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Почему Вам кажется поведение IE более естественным?
Вы пишите
<head/>
<main>
<left/>
<middl/>
<right/>
</main>
<bottom/>
При этом забиваете высоту main явно. Ну NN вам это и покзавает как Вы написали.
Ваше поведение может обеспечить - убрать height в main.
Или переместить bottom в main.
...
Рейтинг: 0 / 0
помогите адаптировать код под NN
    #35058589
apapacy
Ваше поведение может обеспечить - убрать height в main.
Или переместить bottom в main.

Ни одно, ни другое не помогло. Если писать
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
<div id="header">
</div>
<div id="main">
     <div id="left">
     </div> 
     <div id="middle">
        .............................. 
        <BR><BR><BR><BR><BR>
     </div>
     <div id="right">
     </div>
     <div id="bottom">
      op[o[o[pp[o[pop[opo[
     </div>
  </div>

то bottom позиционируется относительно header, то же самое если убрать height в main
Мне надо распологать bottom на 50 пикселей выше низа заполненного контентом middl-а
...
Рейтинг: 0 / 0
помогите адаптировать код под NN
    #35058604
apapacy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
У меня только FF под Linux. Ваш текст и у меня отображается не так как Вы хотите. Ну вот я помудрил немного и вот что получилось

Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<style type="text/css">

 #header{width:900px; margin-left:50px; margin-top:10px; height:200px; background:#FFAAFF}
 #main{float:left;overflow:visible;width:800px; margin-left:100px; margin-top:-10px;background:blue}
   #left{float:left;width: 20 %; height:200px; margin-top:50px;background:#AA0000}
   #middle{float:left;width: 60 %; background:#00AA00}
   #right{float:left;width: 20 %;height:200px; margin-top:50px;background:#0000AA}
 #bottom{float:left;width:550px; height:100px;margin-left:350px;margin-top:-10px; background:# 999900 }

</style>
</head>

<body>

  <div id="header">header
  </div>

  <div id="main">main
     <div id="left">left
     </div> 
     <div id="middle">
         В своїй “Автобіографії” Бертран Рассел писав : “Всю мою жизнь пронизывали три страсти, простые, но неодолимые в своем могуществе: жажда любви, тяга к знанию и мучительное сочувствие к страданиям человечества”.  Ця фраза може слугувати візитною карткою філософа, в ній – весь сенс життя Рассела, його переконань і світосприйняття.
         Бертран Артур Уільям Рассел народився  18  травня  1872  року в аристократичній англійській родині. Його батько, віконт Емберлі, був третім сином Джона Рассела, лідера вігів, що обіймав пост прем’єр-міністра Великої Британії в  1846 - 1852  і  1865 - 1866  роках. Наприкінці  1889  р. Рассел поступив в Трініті-коледж(Кембридж), де навчався з жовтня  1889  року по червень  1894 –го і як наслідок отримав чудову освіту в галузі математики й логіки. В ці роки він захоплюється математикою, логікою, філософією, в  1896  році пише докторську по геометрії і невдовзі стає визнаним вченим; в  1908  р. його приймають в Королівське наукове товариство.  Походженню Рассел має завдячувати непохитним переконанням в своєму праві на голос. Він сприймав як належне свою можливість доступу до представників уряду і мав впевненість в тому, що до його думки будуть прислухатися. Це стало основою активної суспільно-політичної діяльності Рассела, апогеєм якої став період Першої світової війни. Сам він так описує зміни, що відбулися в його свідомості          в цей період: “Я вынужден был пересмотреть свои взгляды на человеческую природу... ... ... Раньше я полагал, что любовь к своим детям - естественное родительское чувство, но война убедила меня, что оно встречается крайне редко ... ... ... До тех пор я думал, что большинство интеллектуалов любит истину, но вот вновь обнаружилось, что едва ли десять процентов из них предпочитают правду собственной популярности”. 
        <BR><BR><BR><BR><BR>
     </div>
     <div id="right">right
     </div>
  </div>

  <div id="bottom">
    op[o[o[pp[o[pop[opo[
  </div>
</body>
...
Рейтинг: 0 / 0
помогите адаптировать код под NN
    #35058605
apapacy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Участник
Кстати, отрицательные величины margin допускаются спецификацией, но являются vendor-depended
...
Рейтинг: 0 / 0
помогите адаптировать код под NN
    #35058618
это то, что надо, спасибо.
...
Рейтинг: 0 / 0
6 сообщений из 6, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / помогите адаптировать код под NN
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]