Форум  |   Правила  |   Реклама  |   Статьи  |   Поиск  |   Регистрация  |   Вход

DIV заезжает под DIV, как исправить...
Новая тема Написать ответ
# Пт Июн 03, 2011 11:47 pmtrepsXe Зарег.: 02.05.2011 ; Сообщ.: 1172Ответить с цитатой
Код:
<!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>[TITLE]</title>
</head>
<body>
<!--- style --->
<style type="text/css">
body {
  margin: 0;
  padding: 0;
}

#cont {
  margin: 0 auto;
  margin-top: 10px;
  width: 640px;
}
#top {
  width: 640px;
  height: 30px;
  background: blue;
  position: fixed;
}
#post {
  background: grey;
}
</style>
<!--- style end --->
<div id="cont">
  <div id="top"></div>
  <div id="post">
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  <br />
  </div>
</div>
</div>
</body>
</html>


Спасибо, что опустились суды r5 (жалко ката не обнаружилось)

Итак

При прокрутки страницы (br спецально для этого теста) серый блок скролится под синий.
Как сделать, чтобы серый блок не скролися под красным?
Целый час ломаюсь, до инфаркта доведет ведь :baaa:

Кстати, без гемороя, зайдите сюда - http://jsfiddle.net/YRsnZ/ , сделайте 4ое окошко побольше и проскрольте... вы увидите как белый отступ закроется серым.
# Пт Июн 03, 2011 11:51 pmDrKronos Зарег.: 11.03.2008 ; Сообщ.: 13024Ответить с цитатой
http://jsfiddle.net/YRsnZ/1/
# Пт Июн 03, 2011 11:53 pmtrepsXe Зарег.: 02.05.2011 ; Сообщ.: 1172Ответить с цитатой
DrKronos писал(а):
http://jsfiddle.net/YRsnZ/1/


эх, не уточнил. мне нужно чтобы блок top был фиксированным
# Пт Июн 03, 2011 11:55 pmDrKronos Зарег.: 11.03.2008 ; Сообщ.: 13024Ответить с цитатой
http://jsfiddle.net/YRsnZ/5/ так?
# Сб Июн 04, 2011 12:01 amtrepsXe Зарег.: 02.05.2011 ; Сообщ.: 1172Ответить с цитатой
DrKronos писал(а):
http://jsfiddle.net/YRsnZ/5/ так?


отступ с верху нужен, а ты его убрал Smile
# Сб Июн 04, 2011 12:06 amDrKronos Зарег.: 11.03.2008 ; Сообщ.: 13024Ответить с цитатой
http://jsfiddle.net/8RyrX/1/ так? :`( :mrrgreen:
# Сб Июн 04, 2011 12:10 amtrepsXe Зарег.: 02.05.2011 ; Сообщ.: 1172Ответить с цитатой
DrKronos писал(а):
http://jsfiddle.net/8RyrX/1/ так? :`( :mrrgreen:


хорошая идея, НО у меня фон не однотонный, облака Smile
белый блок будет не к месту
# Сб Июн 04, 2011 12:25 amDrKronos Зарег.: 11.03.2008 ; Сообщ.: 13024Ответить с цитатой
Можно сделать для топа и серой части общий слой, тогда выходить не должно. С утра попробую, уже спать
# Сб Июн 04, 2011 4:39 pmtrepsXe Зарег.: 02.05.2011 ; Сообщ.: 1172Ответить с цитатой
DrKronos писал(а):
Можно сделать для топа и серой части общий слой, тогда выходить не должно. С утра попробую, уже спать


хз, помойму подобное пытался сделать, но не выходит
# Сб Июн 04, 2011 4:59 pmYabuti Зарег.: 28.11.2008 ; Сообщ.: 16263Ответить с цитатой
<div id="cont" style="margin-bottom:500px;"> ???
# Сб Июн 04, 2011 5:03 pmtrepsXe Зарег.: 02.05.2011 ; Сообщ.: 1172Ответить с цитатой
Yabuti писал(а):
<div id="cont" style="margin-bottom:500px;"> ???


нее, возможно ты не понял. :mrrgreen:
# Сб Июн 04, 2011 6:22 pmDrKronos Зарег.: 11.03.2008 ; Сообщ.: 13024Ответить с цитатой
Что-то не получается, как тебе нужно.
Появилась идея сделать так http://jsfiddle.net/Pc3Y8/62/ . Может так даже лучше? Smile
# Сб Июн 04, 2011 6:32 pmtrepsXe Зарег.: 02.05.2011 ; Сообщ.: 1172Ответить с цитатой
DrKronos писал(а):
Что-то не получается, как тебе нужно.
Появилась идея сделать так http://jsfiddle.net/Pc3Y8/62/ . Может так даже лучше? Smile


я тоже так делать, но охота чтобы скролл был у браузера, а не у дива.

спасибо и на этом
# Сб Июн 04, 2011 8:10 pmTaburetkin Зарег.: 25.02.2007 ; Сообщ.: 1426Ответить с цитатой
Код:
<!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
;>
<html>
 <head>
 <title>[TITLE]</title>
 </head><!--- style --->
 <style type="text/css">
 body {
   padding: 0;
   margin: 0;
   background-color: #FFF;
 }

 #cont {
   margin-top: 0px;
   width: 640px;
   padding: 0px;
   margin-right: auto;
   margin-bottom: 0;
   margin-left: auto;
 }
 #veryTop {
   height: 10px;
   position: fixed;
   width: 100%;
   clear: right;
   z-index: 100;
   background-color: #FFF;
}
 #top {
   width: 640px;
   height: 30px;
   background: blue;
   position: fixed;
   top: 10px;
 }
 #post {
   background-color: #CCC;
   top: 10px;
 }
 </style>
 <!--- style end --->
<body>
<div id="veryTop"></div>
 <div id="cont">
   <div id="top"></div>
   <div id="post">
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br /> jksfjks
   <br /> sfsfs
   <br /> sfsfs
   <br /> sfsf
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   <br />
   </div>
 </div>
 </div>
</body>
</html>

# Сб Июн 04, 2011 8:12 pmtrepsXe Зарег.: 02.05.2011 ; Сообщ.: 1172Ответить с цитатой
Taburetkin, оффигенно! спасибо Drinks or Beer
Новая тема Написать ответ    ГЛАВНАЯ ~ ТЕХНИЧЕСКИЕ ВОПРОСЫ
 
Любое использование материалов, размещенных на ArmadaBoard.com, без разрешения владельцев ArmadaBoard.com запрещено.