Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
PHP 5. На примерах. Авторы: Кузнецов М.В., Симдянов И.В., Голышев С.В. PHP. Практика создания Web-сайтов (второе издание). Авторы: Кузнецов М.В., Симдянов И.В. Социальная инженерия и социальные хакеры. Авторы: Кузнецов М.В., Симдянов И.В. MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. MySQL на примерах. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Как побороть
 
 автор: mastergrom   (22.07.2008 в 00:01)   письмо автору
 
 

Всем привет!

имеется следующее:

<html>
<style>
html {
       font-family:Arial;
    font-size: 12px;
    font-weight:200;
    color:black;
    background:#ccc;
    
}

body {
  padding:0; margin:0 auto;
  width:1000px;
  position:relative;
  min-height:100%;
  background:#ccc;
}
* html #content {
  margin-left:10%;
  
}
#wrapper {
  overflow:hidden; width:100%;
  padding-bottom:73px;
    background:#fff;
}

* html body {
  height:100%;
}
#header {
    width:1000px;
    height:120px;
    
}


#content {
float:left; width:53%;
margin-left:20%;
padding-bottom:200px;    
    
}


#menu {
    float:left; width:20%; margin-left:-73%;
    padding-left:20px;
}

#right {
float:right; width:27%;

}
#bottom {

    background:#fff url(images/footer.jpg) top left no-repeat;
    position:absolute; bottom:0;
    height:71px;
    width:100%;
    padding:1px 0;

}

#bottom_content {
position:absolute; 
bottom:71px;
marin-top:20px;


}

</style>

<body>
....
<div id='content'>
bla bla bla
<a href='#1' class='link' onclick="if (document.getElementById('full_text_2').style.display=='none'||document.getElementById('full_text_2').style.display=='') {document.getElementById('full_text_2').style.display='inline'; this.style.background='url(images/minus.jpg) left no-repeat';} else {document.getElementById('full_text_2').style.display='none'; this.style.background='url(images/plus.jpg) left no-repeat';}">ссылка </a><br />
<div id="full_text_2" class="hidden">
long bla bla
</div>
<div id='bottom_content'>bla-bla</div>
</div>
....
</body>
</html>


То есть, есть div 'content' в котором установлен padding-bottom что-бы вместить и прибиить к низу каждой страницы содержимое diva 'bottom_content'

Но есть одна страница на сайте где есть скрытые div, при нажатии на ссылку, свойству display этого дива присваивается значение inline и div типа раскрывается ... Но проблема в том что в IE 6 содержимое div 'bottom_content' остается на прежнем месте и не смещается вниз когда скрытый div становится видимым ...

В опере тоже как-то странновато работает... Просто у меня еще присутствует вложенность скрытых дивов.. То есть, один скрытый, включает в себя еще несколько скрытых, которые включают в себя еще скрытые :)

В IE 7 и в Mozilla все работает нормально ...

Никто не в курсе как побороть?

   
 
 автор: GeorgeIV   (22.07.2008 в 10:19)   письмо автору
 
   для: mastergrom   (22.07.2008 в 00:01)
 

padding-bottom:200px;


это означает, что контент не будет доходить до конца дива на 200 px, а не прибивание книзу

   
 
 автор: mastergrom   (22.07.2008 в 11:03)   письмо автору
 
   для: GeorgeIV   (22.07.2008 в 10:19)
 

Если взять, весь CSS, то получается что div #bottom у меня прибвается к низу странцы, а div bottom_content позиционируется внизу страницы с отступом от bottom = высота bottom .. А padding в div content сделан для того что-б содержмое content не налазило на bottom_content ... Но вопрос, вобще-то не об этом ... А о том, почему при разворачивании скрытых div, bottom_content не смещается в IE 6, а остается на месте..

   
 
 автор: GeorgeIV   (22.07.2008 в 15:27)   письмо автору
 
   для: mastergrom   (22.07.2008 в 11:03)
 

#bottom_content { 
position:absolute;  
bottom:71px; 
marin-top:20px;

Куда же он будет смещаться, если у него абсолютное позиционирование

   
 
 автор: mastergrom   (22.07.2008 в 15:54)   письмо автору
 
   для: GeorgeIV   (22.07.2008 в 15:27)
 

Ну так, в Mozilla и IE 7 он то смещается ...
А вобще, решил проблему следующим образом:

внизу div #content сделал <div id='bot'></div>

ну и javascript:
function test () {

var content = "<div style='position:absolute; bottom:71px;marin-top:20px;' id='bottom_content'>bla bla</div>"
document.getElementById('bot').innerHTML=content;
}


ну и прикрутил эту функцию на ссылки которые открывают скрытые div

правда пришлось еще убрать position:absolute для div#bottom:

И все работает!

   
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования