Исчезает блок справа

@Dragone · Регистрация: 28.04.2019

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

Доброго времени суток, во время изучения языков HTML, CSS, JS(он не касается этой проблемы) и PHP(он не касается этой проблемы) у меня возникла проблема. Я делал каркас для сайта и при тесте заметил что правый блок (sidebar) пропал. Открыл код в браузере через кнопку "Просмотреть код" и мне показывает что тот блок находится в в верхнем блоке (header), а его содержимое не понятно где. Прошу, помогите найти ошибку. Вот мой код:

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
<html>
    <head>
        <style>
.content_img {
width:500px; 
height:600px;
}
#but {
display: inline-block;
margin-top: 10px;
padding-bottom: 10px;
color: #d1d1d1;
font-family: "Roboto Condensed",sans-serif;
font-size: 23px;
font-weight: 700;
letter-spacing: .1px;
position: relative;
}
.content {
float:left;
height:410px;
}
.right_sidebar {
float:right;
}
.left_sidebar {
float:left;
}
.footer {
background-color: #242323;
padding-top:30px;
padding-right:1000;
vertical-align:top;
width: 100%;
height: 120px;
background: rgba(14,14,14,0.95);
margin-bottom:0;
padding-bottom:0;
}
.row:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.row {
display: inline-block;
}
/*\*/
* html .row {
height: 1%;
}
.row {
display: block;
}
        <style>
        <? include("CSS/standart-css.php"); ?>
    </head>
    <body>
        <div class="wrapper">
            <div class="header">
                <? include("header/drop-down.php"); ?>
            </div>
            <div class="row">
                <div width="30%" class="left_sidebar">
                    <div class="catside">
                        <p id="test"><button onmouseout="outmouse();" onmouseover="overmouse();" id="but" style="background: transparent; border:0; padding:0; padding-top:5px; padding-left:5px; padding-right:5px; margin:0;"><img src="image/brawlstars.png" width="30px" height="30px">&nbsp;Brawlstars</button></p>
                        <hr style="border:solid 2px #fffff;">
                    </div>
                </div>
                <div width="40%" class="content">
                    <p>Бла Бла Бла</p>
                </div>
                <div width="30%" class="right_sidebar">
                    <div class="content_box">
                        <img class="conten_imgt" src="image/content.bmp">
                    </div>
                </div>
            </div>
            <div class="footer">
                <code style="color:red; font-size:20px;">&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;Связаться с нами <a href="тест">ВКонтакте</a>,Email тест@bk.ru</code><br/>
        </div>
        </div>
        <script>
function overmouse() {
    var
        button = document.getElementById('but');
    button.style = "backgroung:#008EB0; border:0; padding:0; padding-top:5px; padding-left:5px; padding-right:5px; margin:0; color:black;";
}
function outmouse() {
    var
        button = document.getElementById('but');
    button.style = "background:transparent; border:0; padding:0; padding-top:5px; padding-left:5px; padding-right:5px; margin:0;";
}
        </script>
    </body>
</html>

Возможно вы заметили вот это в теге style:/*\*/ я просто использовал clearfix и не разобрался нужная ли эта строка. Буду очень благодарен, только прошу писать адекватные ответы.

@Alex Web · 21.12.2019, 18:46

Вы про right_sidebar ? Он никуда не пропал, ему не была задана ширина и он укатился вправо (float:right) Остальным тоже ширина не задана. То есть она равна ширине контента, то есть если заместо <p>Бла Бла Бла</p> написать <p>Бла Бла Бла * 150</p> то от float толку не будет

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
.left_sidebar {
    float: left;
    width: 30%;
}
 
.content {
    float: left;
    height: 410px;
    width: 40%;
    background-color: blue;
}
 
.right_sidebar {
    float: right;
    width: 30%;
    background-color: red;
}

</style> не был закрыт

<hr style="border:solid 2px fffff;"> не #ffffff

Возможно вы заметили вот это в теге style:/*\*/ я просто использовал clearfix и не разобрался нужная ли эта строка

Какая эта? /*\*/ эта?

@Dragone · 21.12.2019, 22:22 **[ТС]**

Сообщение от Alex Web

Он никуда не пропал, ему не была задана ширина и он укатился вправо (float:right) Остальным тоже ширина не задана.

Сообщение от Alex Web

.right_sidebar {
float: right;
width: 30%;
background-color: red;
}

От этого кода толку нет. И ты не заметил что я указывал ширину в атрибутах? Я немного потестил и понял что не указал высоту блока всё появилось но работал только background-color все остальные элементы внутри блока right_sidebar исчезают что можно заметить при загрузке страницы. Как мне это исправить?

@Alex Web · 22.12.2019, 00:25

Сообщение от Dragone

От этого кода толку нет. И ты не заметил что я указывал ширину в атрибутах?

HTML5
1
<div width="40%" class="content">

замени на

HTML5
1
<div style="width: 40%;" class="content">

и так все остальные, тогда они встанут как надо

Сообщение от Dragone

Я немного потестил и понял что не указал высоту блока всё появилось но работал только background-color все остальные элементы внутри блока right_sidebar исчезают что можно заметить при загрузке страницы.

Не знаю у меня ничего не исчезло, и фото и текст все туда вставить можно. Делай скрин

PHP
1
2
3
4
5
<? include("CSS/standart-css.php"); ?>
 
<div class="header">
                <? include("header/drop-down.php"); ?>
</div>

В пхп не бум бум еще совсем от этого же слова. Не знаю что ты там подгружаешь, но ЛОКАЛЬНО все работает как надо ничего нигде не исчезает.

@Dragone · 22.12.2019, 00:46 **[ТС]**

Сообщение от Alex Web

<div width="40%" class="content"> замени на <div style="width: 40%;" class="content">
и так все остальные, тогда они встанут как надо
Сообщение от Dragone
Я немного потестил и понял что не указал высоту блока всё появилось но работал только background-color все остальные элементы внутри блока right_sidebar исчезают что можно заметить при загрузке страницы.
Не знаю у меня ничего не исчезло, и фото и текст все туда вставить можно. Делай скрин

Чистой случайностью я стёр строку <div class="content_box"> и почему то всё встало на свои места правда там картинка не совсем правильно становилась, но это поправимо. Что давал или не давал этот блок в котором была картинка? Пользовался Chrome, если что. Но от того что ты написал не было толку. (Сори если обидел).

Новые блоги и статьи Все статьи Все блоги /
Отчёт о спецтехнике находящейся в ремонте Maks 20.04.2026 Отчёт из решения ниже размещен в конфигурации КА2. Задача: отобразить спецтехнику, которая на данный момент находится в ремонте. Есть нетиповой документ "Заявка на ремонт спецтехники" который. . .	Памятка для бота и "визитка" для читателей "Semantic Universe Layer (Слой семантической вселенной)" Hrethgir 19.04.2026 Сгенерировано для краткого описания по случаю сборки и компиляции скелета серверного приложения. И пусть после этого скажут, что статьи сгенерированные AI - туфта и не интересно. И это не реклама -. . .	Запрет удаления строк ТЧ документа при определенном условии Maks 19.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "Аккумуляторы", разработанного в конфигурации КА2. У данного документа есть ТЧ, в которой в зависимости от прав доступа. . .	Модель заражения группы наркоманов alhaos 17.04.2026 Условия задачи сформулированы тут Суть: - Группа наркоманов из 10 человек. - Только один инфицирован ВИЧ. - Колются одной иглой. - Колются раз в день. - Колются последовательно через. . .
Мысли в слух. Про "навсегда". kumehtar 16.04.2026 Подумалось тут, что наверное очень глупо использовать во всяких своих установках понятие "навсегда". Это очень сильное понятие, и я только начинаю понимать край его смысла, не смотря на то что давно. . .	My Business CRM MaGz GoLd 16.04.2026 Всем привет, недавно возникла потребность создать CRM, для личных нужд. Собственно программа предоставляет из себя базу данных клиентов, в которой можно фиксировать звонки, стадии сделки, а также. . .	Знаешь почему 90% людей редко бывают счастливыми? kumehtar 14.04.2026 Потому что они ждут. Ждут выходных, ждут отпуска, ждут удачного момента. . . а удачный момент так и не приходит.	Фиксация колонок в отчете СКД Maks 14.04.2026 Фиксация колонок в СКД отчета типа Таблица. Задача: зафиксировать три левых колонки в отчете. Процедура ПриКомпоновкеРезультата(ДокументРезультат, ДанныеРасшифровки, СтандартнаяОбработка) / / . . .

Опции темы