съезжает блок div

@D1mon · Регистрация: 12.06.2011

Студворк — интернет-сервис помощи студентам

При изменении размера браузера block3 съезжает залезая на 1-й и 2-й блоки. Нужно что-бы 3-й блок оставался на месте (по горизонтали) относительно 2-го блока, а по вертикали был fixed.

HTML5
1
2
3
4
<div id="block1">
  <div id="block2"></div>
  <div id="block3"><img1...><img2...></div>
</div>

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
#block1 {
    background:url(images/backgroung.jpg) no-repeat;
    width:1000px;   
    height:1280px;
    margin:0 auto;
    max-width:1000px;
}
 
#block2 {
    width:862px;    
    height:969px;
    margin:0 auto;
    padding:80px 0 85px 0;
}
 
#block3 {
    width: 42px;
    height:187px;
    padding:15px 0; 
    position:fixed;
    top:195px;
    right:190px;
}

Стили оставил как были.

@htc_storm · 07.06.2012, 16:48

Чтоб не залазил 1-й блок на 2-й блок, можно сделать так.

CSS
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
 
#block1 {
    background:url(images/backgroung.jpg) no-repeat;
    width:1000px;   
    height:1280px;
    margin:0 auto;
    max-width:1000px;
}
 
#block2 {
    width:862px;    
    height:969px;
    margin:0 auto;
    padding:80px 0 85px 0;
 
}
 
#block3 {
    width: 42px;
    height:187px;
    padding:15px 0; 
   position:fixed;
    top:195px;
float:right;
margin-left:940px;
 
}

Не забываем говорить спасибо!

@nightkon · 07.06.2012, 17:54

Вот, пожалуйста. Прошу вас тоже изучить код.

HTML5
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
40
41
42
43
44
45
46
47
48
49
50
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>See The Coupon First</title>
    <style type="text/css">
    * { margin: 0; padding: 0; }
    #block1 {
        background-color: grey;
        width:1000px;   
        height:100%;
        margin:0 auto;
        position: relative;
    }
     
    #block2 {
        background-color: yellow;
        width:862px;    
        height:969px;
        margin:0 auto;
        padding:80px 0 85px 0;
        position: relative;
    }
     
    #block3 {
        float: right;
        width: 42px;
        margin-right: 10px;
    }
    #block4 {
        background-color: white;
        width: 42px;
        height:187px;
        padding:15px 0; 
        position:fixed;
        top:50%;
        margin-top: -93px;
    }
    </style>
</head>
 
<body>
    <div id="block1">
        <div id="block2"></div>
        <div id="block3">
            <div id="block4"></div>
        </div>
    </div>
</body>
</html>

@D1mon · 08.06.2012, 13:30 **[ТС]**

Нашел решение:
блок3 - relative;
img - fixed

Оказалось все чем казалось

Новые блоги и статьи Все статьи Все блоги /
Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а привычная функция main(). . .	моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .
http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .	Расчёт переходных процессов в цепи постоянного тока igorrr37 16.01.2026 / * Дана цепь(не выше 3-го порядка) постоянного тока с элементами R, L, C, k(ключ), U, E, J. Программа находит переходные токи и напряжения на элементах схемы классическим методом(1 и 2 з-ны. . .	Восстановить юзерскрипты Greasemonkey из бэкапа браузера damix 15.01.2026 Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .	Сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/

@D1mon 4 / 4 / 0 Регистрация: 12.06.2011 Сообщений: 18
	08.06.2012, 13:30 [ТС]
	Нашел решение: блок3 - relative; img - fixed Оказалось все чем казалось 0