как заставить блок не обтекать другой блок

@marissa-86 · Регистрация: 14.01.2014

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

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
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Valeria-clothes-интернет магазин женской одежды | Распродажи | Недорогая стильная и модная женская одежда</title>
<link type="text/css" rel="stylesheet" href="css/style.css">
<link type="text/css" rel="stylesheet" href="css/slider.css">
<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/jquery.eislideshow.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript">
$(function() {
    $('#ei-slider').eislideshow({
        animation : 'center',
        easing      : 'easeOutExpo',
        titleeasing : 'easeOutExpo',
        titlespeed  : 1200
    });
});
</script>
</head>
 
<body>
<div id=”Box”>
 
 <div id=”Header”>
  <div id="topheader">
   <table  width="100%" cellspacing="0" id="maket" ><tr> 
    <td  width="500"><img src="img/logo1.png" alt="" /></td>
    <td  >Личный кабинет<br><br> Войти | Регистрация</td>
    <td  ><img src="img/bag.jpg" /><br /> Корзина</td>
   </tr> </table> 
  </div> 
  <div id="menuheader">
   <table  width="100%" cellspacing="0"  >
   <tr> 
    <td width="25%"><p align="center"><a href=""><font color="#FFFFFF">Интернет-магазин</font></a></p> </td>
    <td width="25%" > <p align="center"><a href=""><font color="#FFFFFF">Акции</font></a></p></td>
    <td  width="25%"><p align="center"><a href=""><font color="#FFFFFF">Доставка и оплата</font></a> </p></td>
    <td  width="25%"><p align="center"><a href=""><font color="#FFFFFF" >Контакты</font></a></p></td>
   </tr> </table>
   </div>
  </div>
  <!-- -->
    <div class="wrapper">
    <div id="ei-slider" class="ei-slider">
        <ul class="ei-slider-large">
        <li>
            <img src="https://www.cyberforum.ru/images/large/1.jpg" alt="image01" />
          <div class="ei-title">
            <h2>Коктельные, вечерние и повседневные</h2>
            <h3>Платья</h3>
          </div>
        </li>
        <li>
            <img src="https://www.cyberforum.ru/images/large/2.jpg" alt="image02" />
          <div class="ei-title">
            <h2>Офисные и элегантные</h2>
            <h3>Блузки</h3>
          </div>
        </li>
        <li>
            <img src="https://www.cyberforum.ru/images/large/3.jpg" alt="image03"/>
          <div class="ei-title">
            <h2>Спортивные, джинсовые и офисные </h2>
            <h3>Шорты</h3>
          </div>
        </li>
        <li>
            <img src="https://www.cyberforum.ru/images/large/4.jpg" alt="image04"/>
          <div class="ei-title">
            <h2>Укороченные, зауженные, классические</h2>
            <h3>Брюки</h3>
          </div>
        </li>
        <li>
            <img src="https://www.cyberforum.ru/images/large/5.jpg" alt="image05"/>
          <div class="ei-title">
            <h2>Миди, мини, макси</h2>
            <h3>Юбки</h3>
          </div>
        </li>
        <li>
            <img src="https://www.cyberforum.ru/images/large/6.jpg" alt="image06"/>
          <div class="ei-title">
            <h2>Вязаные и джинсовые, длинные и короткие</h2>
            <h3>жакеты</h3>
          </div>
        </li>
        <li>
            <img src="https://www.cyberforum.ru/images/large/7.jpg" alt="image07"/>
          <div class="ei-title">
            <h2>Классически и зауженные</h2>
            <h3>Джинсы</h3>
          </div>
        </li>
      </ul><!-- ei-slider-large -->
        <ul class="ei-slider-thumbs">
        <li class="ei-slider-element">Current</li>
        <li><a href="#">Slide 1</a><img src="https://www.cyberforum.ru/images/thumbs/1.jpg" alt="thumb01"></li>
        <li><a href="#">Slide 2</a><img src="https://www.cyberforum.ru/images/thumbs/2.jpg" alt="thumb02"></li>
        <li><a href="#">Slide 3</a><img src="https://www.cyberforum.ru/images/thumbs/3.jpg" alt="thumb03"></li>
        <li><a href="#">Slide 4</a><img src="https://www.cyberforum.ru/images/thumbs/4.jpg" alt="thumb04"></li>
        <li><a href="#">Slide 5</a><img src="https://www.cyberforum.ru/images/thumbs/5.jpg" alt="thumb05"></li>
        <li><a href="#">Slide 6</a><img src="https://www.cyberforum.ru/images/thumbs/6.jpg" alt="thumb06"></li>
        <li><a href="#">Slide 7</a><img src="https://www.cyberforum.ru/images/thumbs/7.jpg" alt="thumb07"></li>
      </ul><!-- ei-slider-thumbs -->
    </div><!-- ei-slider -->
  </div>
 </div>
 
 <!--меню, контент и прочая фигня-->
 <div >llll
  <div id="left"></div>
 <div>
</body>
</html>

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
28
29
30
31
32
33
@charset "utf-8";
/* CSS Document */
@import url('reset.css');
html, body{margin:0; padding:0;}
#topheader{
    width: 1000px;
    margin: 7px; 
    padding: 10px 50px 10px 50px; }
     #maket TD {
    padding: 10px; 
    width: 200px; 
   }
   
#menuheader{ width: auto; background-color: #666666; text-decoration:none; font-family:"Times New Roman", Times, serif }
#Box{ width: 1000px; border:solid black 1px;
float:none;}
a:hover {color: #666666; 
background: #999999; }
 
#left{
float:none;
width:200px;
}
#content{ overflow:hidden;
float:none;
margin: 10 px;
padding: 20 px;
width: 2000 px;}
 
 
#footer{
border: 1px solid  #000000 dotted
}

текст должен быть в новом блоке а он почему то оказывается сбоку

@marissa-86 · 15.02.2014, 11:22 **[ТС]**

единственный выход вижу поставить <br> но не повредит ли это в будушем при верстке?

@nobilissimus · 15.02.2014, 11:25

Хорошо бы "вживую" посмотреть

@marissa-86 · 15.02.2014, 11:34 **[ТС]**

вот

@nobilissimus · 15.02.2014, 12:30

Сообщение от marissa-86

вот

Описание товара должно быть ниже? Я не понял какой именно текст, на прикрепленной картинке его нет ))

@marissa-86 · 15.02.2014, 12:43 **[ТС]**

если этот бр удалить пред каталогом, а вы попробуйте уберите то блок поедет вверх обтекая предыдущий блок

@nobilissimus · 15.02.2014, 12:51

Сообщение от marissa-86

если этот бр удалить пред каталогом, а вы попробуйте уберите то блок поедет вверх обтекая предыдущий блок

У меня как-то все по-другому, с <br> есть соответствующий отступ, без него тоже блок остается на своем месте

как заставить блок не обтекать другой блок

В каком браузере проверяете?

@nobilissimus · 15.02.2014, 13:00

А вообще, советую проверить позиционирование всех предыдущих блоков, т.к. для многих не заданы стили вообще, стилизуйте для начала большие блоки, чтоб каждый из них находился на своем месте, и тогда большая вероятность, что такое поведение блоков исчезнет.

@marissa-86 · 15.02.2014, 13:15 **[ТС]**

а у меня вот так вот а у вас какой браузер ?

@nobilissimus · 15.02.2014, 13:18

Скрин сделан в Qip Surf (тот же Chrome, только от Qip), также проверял в IE 10, в Firefox есть неточности в описании слайдера, картинка находится левее и текст немного ее перекрывает, а вот нижний блок везде одинаков.

Новые блоги и статьи Все статьи Все блоги /
Модель микоризы: классовый агентный подход anaschu 02.01.2026 Раньше это было два гриба и бактерия. Теперь три гриба, растение. И на уровне агентов добавится между грибами или бактериями взаимодействий. До того я пробовал подход через многомерные массивы,. . .	Учёным и волонтёрам проекта «Einstein@home» удалось обнаружить четыре гамма-лучевых пульсара в джете Млечного Пути Programma_Boinc 01.01.2026 Учёным и волонтёрам проекта «Einstein@home» удалось обнаружить четыре гамма-лучевых пульсара в джете Млечного Пути Сочетание глобально распределённой вычислительной мощности и инновационных. . .	Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Programma_Boinc 28.12.2025 Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / ********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / ********/ gallery/ bKBkQFf Пост отсюда. . .	Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США. Programma_Boinc 26.12.2025 Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .	Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Programma_Boinc 23.12.2025 Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .
PhpStorm 2025.3: WSL Terminal всегда стартует в ~ and_y87 14.12.2025 PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .	Как объединить две одинаковые БД Access с разными данными VikBal 11.12.2025 Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.	Новый ноутбук volvo 07.12.2025 Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro	Музыка, написанная Искусственным Интеллектом volvo 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .

@marissa-86 0 / 0 / 0 Регистрация: 14.01.2014 Сообщений: 47
	15.02.2014, 11:22 [ТС]
	единственный выход вижу поставить <br> но не повредит ли это в будушем при верстке? 0

@nobilissimus 0 / 0 / 1 Регистрация: 15.02.2014 Сообщений: 10
	15.02.2014, 11:25
	Хорошо бы "вживую" посмотреть 0

@marissa-86 0 / 0 / 0 Регистрация: 14.01.2014 Сообщений: 47
	15.02.2014, 12:43 [ТС]
	если этот бр удалить пред каталогом, а вы попробуйте уберите то блок поедет вверх обтекая предыдущий блок Миниатюры 0

@nobilissimus 0 / 0 / 1 Регистрация: 15.02.2014 Сообщений: 10
	15.02.2014, 13:00
	А вообще, советую проверить позиционирование всех предыдущих блоков, т.к. для многих не заданы стили вообще, стилизуйте для начала большие блоки, чтоб каждый из них находился на своем месте, и тогда большая вероятность, что такое поведение блоков исчезнет. 0

@marissa-86 0 / 0 / 0 Регистрация: 14.01.2014 Сообщений: 47
	15.02.2014, 13:15 [ТС]
	а у меня вот так вот а у вас какой браузер ? Миниатюры 0

@nobilissimus 0 / 0 / 1 Регистрация: 15.02.2014 Сообщений: 10
	15.02.2014, 13:18
	Скрин сделан в Qip Surf (тот же Chrome, только от Qip), также проверял в IE 10, в Firefox есть неточности в описании слайдера, картинка находится левее и текст немного ее перекрывает, а вот нижний блок везде одинаков. 0