Добрый день.
Есть php/html страница.
PHP |
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
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
| <!doctype html>
<?php
require_once("connect.php");
require_once("search_dia.php");
require_once("vars.php");
session_start();
?>
<html>
<head>
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1">
<title>Главная страница</title>
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/style_mobile.css">
<script src="scripts/jquery-3.2.1.min.js"></script>
<script src="scripts/carhartl-jquery-cookie-92b7715/jquery.cookie.js"></script>
<script src="scripts/script_style.js"></script>
</head>
<body>
<div class="wrapper">
<header class="index_header">
<a href="index.php"><img src="images/logo.png" class="header_logo"></a>
<?php
search_dia($dbc);
if(isset($_SESSION['user_id'])){
echo('<p class="login">Добро пожаловать, '.$_SESSION['username'].'. | <a href="logout.php">Выйти</a></p>');
?>
</header>
<section class="main">
<div class="table_area">
<div class="table_row">
<div class="dialog_area">
<span class="dia_h">Мои диалоги</span>
<span class="saysay"><a href="index.php?cd=1">Рассказать +</a></span>
<ul class="dialog_list">
<?php
search_dia($dbc);
$query_dialogs="SELECT * from dia where autors_id='".$_SESSION['user_id']."' OR recipient_id='".$_SESSION['user_id']."' order by last_upd desc";
$dialogs_result=mysqli_query($dbc, $query_dialogs) or die('ошибка запроса');
if(mysqli_num_rows($dialogs_result)>0){
//диалоги найдены
while($row_result=mysqli_fetch_array($dialogs_result)){
$query_mes="SELECT sen_id from message where alogdi_id=".$row_result['dialogs_id']." order by sen_date desc";
$mes_result=mysqli_query($dbc, $query_mes) or die('Error searching message');
$mes_row=mysqli_fetch_array($mes_result);
if($mes_row['sender_id']==$_SESSION['user_id'] || (mysqli_num_rows($mes_result)==0 && $row_result['autors_id']==$_SESSION['user_id'])){
echo "<li><a href='?di=".$row_result['dialogs_id']."'><span class='mail_icon'></span><span class='dia_prew'>Диалог</span>#<span class='dia_num'>".$row_result['dialogs_id']."</span></a></li>";} else{
//если автор сообщения не авторизованный юзер
echo "<li><a href='?di=".$row_result['dialogs_id']."'><span class='mail_icon mail_icon_new'></span><span class='dia_prew'>Диалог</span>#<span class='dia_num'>".$row_result['dialogs_id']."</span></a></li>";
}
}
}
else{
//диалоги не найдены
}
?>
</ul>
</div>
<div class="message_area">
<span class="dia_h">Моя переписка</span>
<ul class="message_list">
<?php
//блок кода создания диалога
if(isset($_GET['cd']) && !empty($_SESSION['user_id'])){
//все ок, вывести форму
echo "<form method='post' action='".$_SERVER['PHP_SELF']."' class='create_dia'>
<textarea class='create_inp' name='create_inp' placeholder='Введите текст сообщения' require></textarea>
<input type='submit' value='Отправить записку' class='input_submit input_create' name='create_but'/>
</form>";
}
//блок когда создания диалога
$last_li=0;
if(isset($_GET['di']) && !empty($_SESSION['user_id'])){
$query_dialog="SELECT * from dialogs where dialogs_id=".$_GET['di'];
$query_dialog_result=mysqli_query($dbc,$query_dialog) or die ('ошибка доступа к диалогу');
if(mysqli_num_rows($query_dialog_result)>0){
//такой диалог есть
$dialog_rr=mysqli_fetch_array($query_dialog_result); //строка с информацией о диалоге
if($dialog_rr['autors_id']==$_SESSION['user_id'] || $dialog_rr['recipient_id']==$_SESSION['user_id']){
//проверяем, что авторизованный пользователь либо автор либо получатель диалога
if($dialog_rr['autors_id']==$_SESSION['user_id']){
//если автор диалога авторизованный пользователей
$last_li=0;
echo "<li class='autor'>".$dialog_rr['caption']."</li>";
} else{
//если автор диалога кто-то другой
$last_li=1;
echo "<li class='rec'>".$dialog_rr['caption']."</li>";
}
$query_mes="SELECT * from message where (dialog_id =".$_GET['di']." AND recipient_id=".$_SESSION['user_id'].") OR (dialog_id=".$_GET['di']." AND sender_id=".$_SESSION['user_id'].") order by sending_date";
$query_mes_res=mysqli_query($dbc,$query_mes) or die ('ошибка доступа к сообщениям');
while($mes_row=mysqli_fetch_array($query_mes_res)){
//подгружаем сообщения
if($mes_row['sender_id']==$_SESSION['user_id']){
//автор сообщения авторизованный пользователь
$last_li=0;
echo "<li class='autor'>".$mes_row['content']."</li>";
} else{
//автор сообщения кто-то другой
$last_li=1;
echo "<li class='rec'>".$mes_row['content']."</li>";
}
}
} else{
//пользователь не имеет доступа к этому диалогу
echo "Ошибка доступа к диалогу";
}
}
}
?>
</ul>
<?php
if($last_li==1){
echo "<form method='post' action='".$_SERVER['PHP_SELF']."' class='write_mes'>
<input type='text' class='write_inp' name='write_inp' placeholder='Введите текст сообщения' require/>
<button type='submit' class='write_but' name='write_but'></button>
<input type='hidden' name='did' value='".$_GET['di']."'>
</form>";}
?>
</div>
</div>
</div>
</section>
<?php } else{
//если пользователь не авторизован
echo "
<div class='img_cont'>
<img src='images/poster2.png'/>
<div class='reg_field'>
<a href='registration.php'><span class='use_h index_h input_submit'>Регистрация</span></a>
</div>
<span id='reg_accept'>Если у вас уже есть аккаунт пользователя, вы можете <a href='login.php' style='text-decoration:underline;text-decoration-style:dotted;'>авторизоваться</a>.</span>
</div>
";
} ?>
<?php require_once('footer.php');?>
</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
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
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
| @media screen and (max-width:480px){
html{
max-width: 320px;
border: 1px solid red;
margin: 0px;
padding: 0px;
overflow-x: hidden;
}
.wrapper{
height: 100%;
overflow-x: hidden;
margin: 0 auto;
}
.index_header{
max-width: 320px;
border: 1px solid red;
}
body{
width: 320px !important;
padding: 0px;
font-family: Verdana, Helvetica, Arial, sans-serif;
margin: 0px;
margin-right: 1500px;
overflow-x: hidden !important;
position: relative;
background-color: rgb(249,249,249);
//box-shadow: 2px 1px 4px 0px rgba(220,220,220,1);
}
.header_logo{
width: 75px;
}
.login{
font-size: 12px;
}
.footer_ul{
width: 280px;
display: inline-block;
}
.dia_prew{
display: none;
}
.mail_icon{
width: 20px;
height: 25px;
margin-right: 0px;
}
.dia_num{
font-size: 14px;
margin-right: 7px;
}
.saysay{
font-size: 14px;
margin-bottom: 0px;
}
.table_area{
display: inline-block;
border-spacing: 0px;
width: 320px;
overflow-x: hidden;
}
.table_row{
display: inline-block;
vertical-align: top;
border: none;
margin:0px;
}
.dia_h{
display: inline-block;
font-size: 14px;
margin:0px;
}
.dialog_area{
display: block;
vertical-align: top;
position: relative;
width: 320px;
height: 100px;
margin-bottom: 0px;
margin:0px;
//margin-top: 0px;
}
.dialog_list{
list-style-type: none;
margin: 0px;
padding: 0 0 0 15px;
//height: 95%;
height: 50px;
max-width: 320px;
white-space: nowrap;
}
.dialog_list li{
vertical-align: middle;
margin: 0px;
display: inline;
}
.message_area{
display: inline-block;
width: 100%;
margin-top: 0px;
margin:0px;
vertical-align: top;
position: relative;
//top: 0px;
//left: 450px;
//border: 1px solid black;
height: 100%;
//max-width: 670px;
}
.message_list li{
font-size: 12px;
min-height: 20px;
}
.write_inp{
height: 75px;
width: 80%;
margin-left: 12px;
}
.write_but{
height: 25px;
width: 25px;
}
}
} |
|
При загрузке страница подгружается нормально, то есть весь контент на экран телефона помещается, но появляется скролл бар внизу, который прокручивает какой-то невероятный отступ.
hidden для overflow-x проставил буквально везде, чтобы проверить, может какой-то элемент вылезает, но ничего не вылезает.
Даже если прописать border:1px solid red; для всех блоков, видно, что они умещаются друг в друге.
Если этот же border прописать к самому элементу html, то видно, что обведена страница, а справа от нее какой-то отступ, на который ничего не действует, ни margin, ни padding, ни hidden.
Подскажите как это убрать? Ведь на других сайтах мобильные версии отображаются без всяких полос.
Добавлено через 11 минут
Сейчас попробовал вообще убрать весь контент со страницы, и загрузил пустую, но с мобильной версии. Даже в пустой странице появляется эта непонятная полоса прокрутки. В чем может быть проблема?