Откуда появляются маленькие отступы влево или вправо?

@darkavenger1 · Регистрация: 02.08.2012

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

есть несколько страниц пхп, вроде нормально сверстанных. проблема в том, что откуда то появляются маленькие отступы вправо/влево относительно среднего положения страницы. Получается, когда переходишь по ссылкам, заметно, что страница начинает ездить то немного влево, то вправо, я же хочу чтобы она оставалась на месте. пхп код убираешь - вроде все нормально, но не всегда. Что делать? БОМ ни причем, я его отключил

@romchiksoad · 28.11.2012, 13:27

А код можно глянуть? Для начала тот, который передается браузеру.

@darkavenger1 · 28.11.2012, 17:22 **[ТС]**

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="css/style.css" rel="stylesheet" type="text/css">
<title>Главная страница</title>
<meta name="descripion" content="descr">
<meta name="keywords" content="keyw">
 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="js/validate.min.js" type="text/javascript"></script>
<script src="js/init.js" type="text/javascript"></script>
 
</head>
 
<body>
<div id="header">
  <div id="top_menu">
            <ul>
                <li><a href="index.php" title="Главная">Главная</a></li>
                <li><a href="link1.php" title="Ссылка1">Ссылка1</a></li>
                <li><a href="link2.php" title="Ссылка2">Ссылка2</a></li>
                <li><a href="link3.php" title="Ссылка3">Ссылка3</a></li>
                <li><a href="link4.php" title="Ссылка4">Ссылка4</a></li>
            </ul>
   </div>
   <div id="dop">
        <p id="dop1">Блок1</p><br>
        <p id="dop2">Текст блокаТекст блокаТекст блокаТекст блокаТекст блокаТекст блокаТекст блокаТекст блокаТекст блокаТекст блокаТекст блока</p><br><p id="dop3">Текст блока</p>
   </div>
</div>
<div id="content">
<div id="wrapper">
    <div id="pf">
        <div class="title_block">
            <h4>Главная страница</h4>
        </div>
        <div class="text1">
            <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word</p><br>
<p>in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum"</p><br>
<p>(The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum</p>        </div>
    </div>
   
</div>
</div>
﻿<div id="footer">
<span id="ft1">&copy; Копирайт.</span>
<div id="bottom_menu">
            <ul>
                <li><a href="index.php" title="Главная">Главная</a></li>
                <li><a href="link1.php" title="Ссылка1">Ссылка1</a></li>
                <li><a href="link2.php" title="Ссылка2">Ссылка2</a></li>
                <li><a href="link3.php" title="Ссылка3">Ссылка3</a></li>
                <li><a href="link4.php" title="Ссылка4">Ссылка4</a></li>
            </ul>
   </div>
<div id="ft2"><a href="#lj"><img src="img/lj.png" width="26" height="27"></a>&nbsp;<a href="#vk"><img src="img/vk.png" width="26" height="27"></a></div>
<div id="ft3"><img src="img/counter.jpg" width="88" height="31"></div>
</div></body>
</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
<? include ('blocks/bd.php');
$res = mysql_query("SELECT title,meta_d,meta_k,text FROM pages WHERE page='index'",$db);
if (!$res)
{
echo "<p>Запрос на выборку данных из базы не прошел. Напишите об этом администратору. <br><strong>Код ошибки:</strong></p>";
exit (mysql_error());
}
if (mysql_num_rows($res)>0)
{
    $table = mysql_fetch_array($res);
}
else 
{
echo "<p>Информация по запросу не может быть извлечена, в таблице нет записей.</p>";
exit ();
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="css/style.css" rel="stylesheet" type="text/css">
<title><? echo $table["title"]; ?></title>
<meta name="descripion" content="<? echo $table["meta_d"]; ?>">
<meta name="keywords" content="<? echo $table["meta_k"]; ?>">
 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="js/validate.min.js" type="text/javascript"></script>
<script src="js/init.js" type="text/javascript"></script>
 
</head>
 
<body>
<div id="wrap">
<? include ("blocks/header.php");?>
<div id="content">
<div id="wrapper">
    <div id="text_index">
        <div class="title_block">
            <h4>Главная страница</h4>
        </div>
        <div class="text1">
            <? echo $table["text"]; ?>
        </div>
    </div>
    
    
    
   <div id="latest_w">
        <div class="title_block">
            <h4>Последние работы</h4>
        </div>
        <div class="text1">
        <? $res2 = mysql_query("SELECT id,name,mini_img,date FROM portfolio ORDER BY date DESC, id DESC LIMIT 6",$db);
if (!$res)
{
echo "<p>Запрос на выборку данных из базы не прошел.</strong></p>";
exit (mysql_error());
}
if (mysql_num_rows($res2)>0)
{
    $table2 = mysql_fetch_array($res2);
    do
    {
    printf ("<div class='box'><a href='view_s?id=%s'><img src='%s' alt='%s' title='%s'></a></div>",$table2["id"],$table2["mini_img"],$table2["name"],$table2["name"]); 
    }
    while ($table2 = mysql_fetch_array($res2));
}
else 
{
echo "<p>Информация по запросу не может быть извлечена, в таблице нет записей.</p>";
exit ();
} ?>
        <div id='more_s'><a href='portfolio.php'>Смотреть больше работ</a></div>
        </div>
   </div>
   
   
   <div id="form_z">
        <div class="title_block">
            <h4>Форма заявки</h4>
        </div>
        <div class="text1">
            <? include ('send.php'); ?>
            <form id="form" class="blocks" method="post" enctype="multipart/form-data">
            <p>
                <label>Ваше имя:</label>
                <input type="text" class="text" name="name" />
            </p>
            <p>
                <label>Адрес e-mail:</label>
                <input type="text" class="text" name="email" />
            </p>
            <p class="area">
                <label>Сообщение:</label>
                <textarea class="textarea" name="message"></textarea>
            </p>
            <p>
                <label id="zayav">Заполните <a href="#zayav">заявку</a> на оформление услуги:</label><br>
                <input id="zayav1" name="file" size="34" type="file">
            </p>
            <p>
                <label>&nbsp;</label>
                <input type="submit" class="btn" value="Отправить" />
            </p>
            </form>
            <br><br><br><?=$status;?>
        </div>
   </div>
   
   <div id="news_n">
        <div class="title_block">
            <h4>Новости</h4>
        </div>
        <div class="text1">
        <? $res3 = mysql_query("SELECT id,title,min_text,date FROM news ORDER BY date DESC, id DESC LIMIT 3",$db);
if (!$res3)
{
echo "<p>Запрос на выборку данных из базы не прошел.<br><strong>Код ошибки:</strong></p>";
exit (mysql_error());
}
if (mysql_num_rows($res3)>0)
{
    $table3 = mysql_fetch_array($res3);
    do
    {
    printf ("
            <div class='news1'>
                <div id='top_news'><a href='view_n?id=%s'>%s</a></div>
                <div id='txt_news'><p>%s</p></div>
                <span id='date_news'>Дата: %s</span>
                <span id='link_news'><a href='view_n?id=%s'>Подробнее</a></span>
            </div>
            ",$table3["id"],$table3["title"],$table3["min_text"],$table3["date"],$table3["id"]); 
    }
    while ($table3 = mysql_fetch_array($res3));
}
else 
{
echo "<p>Информация по запросу не может быть извлечена, в таблице нет записей.</p>";
exit ();
} ?>  
        </div>
        <div id="more_news"><a href="news.php">Смотреть больше новостей</a></div>
   </div>
</div>
</div>
<? include ("blocks/footer.php");?>
</div>
</body>
</html>

Добавлено через 6 минут
ну так вот, копирую страницу, пытаюсь сделать новую. В блоке контент на индексе у меня 4 блока равномерно распределены, 2 сверху, 2 снизу. В новом документе убираю 3, оставляю первый, расширяю его по всей длине. И вся фигня смещается влево.

CSS
1
2
3
4
5
6
7
/*TEXT INDEX*/
#text_index {
width:546px;
margin-bottom:0px;
float:left;
height:255px;
}

этот блок левый верхний в контенте.
Переделываю его на:

CSS
1
2
3
#pf {
width:890px;
}

выходит смещение. если ставлю так:

CSS
1
2
3
4
5
#pf {
width:890px;
 
height:255px;
}

то есть с высотой фиксированной, смещения нет.

Добавлено через 3 часа 18 минут
все решил, не знаю как))) доверстал страницу все встало нормально. видать это мои особенности верстки)

@foxxp · 28.11.2012, 17:31

все это оберни в еще один div

для него задай центрирование кроссбраузерное по горизонтали.

@darkavenger1 · 28.11.2012, 18:42 **[ТС]**

да оборачивал, не помогло) может блок какой-нибудь был больше ил что, не знаю) как только заполнил всю страницу, все встало на свои места

@foxxp · 28.11.2012, 19:34

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

да оборачивал, не помогло) может блок какой-нибудь был больше ил что, не знаю) как только заполнил всю страницу, все встало на свои места

это не правильный подход. Все должно быть в одном div'e - только так ты получишь кроссбраузерность. Все размеры (св-ва) div'ов должны храниться в css-файле.

@darkavenger1 · 29.11.2012, 00:10 **[ТС]**

Что-то я не понял куда ты тему увел. У меня все хорошо, мешало только смещение. Причем тут то, что ты сказал?

@koza4ok · 29.11.2012, 14:43

вы используете сброс стилей?
Если вам это поможет

CSS
1
*{padding:0;margin:0}

то проблема в этом(только такое не используйте в проэктах)

@darkavenger1 · 29.11.2012, 17:06 **[ТС]**

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

вы используете сброс стилей?
Если вам это поможет

CSS
1
*{padding:0;margin:0}

то проблема в этом(только такое не используйте в проэктах)

я использую css файл сброса, он мне жестоко удобен. а почему не использовать?

@darkavenger1 · 30.11.2012, 19:54 **[ТС]**

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

CSS
1
body {overflow-y:scroll;}

Новые блоги и статьи Все статьи Все блоги /
Символьное дифференцирование igorrr37 13.02.2026 / * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! */ #include <iostream> #include <stack> #include <cctype>. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .

@darkavenger1 1 / 1 / 1 Регистрация: 02.08.2012 Сообщений: 44

	Откуда появляются маленькие отступы влево или вправо? 28.11.2012, 13:22. Показов 2061. Ответов 9 Метки нет (Все метки) есть несколько страниц пхп, вроде нормально сверстанных. проблема в том, что откуда то появляются маленькие отступы вправо/влево относительно среднего положения страницы. Получается, когда переходишь по ссылкам, заметно, что страница начинает ездить то немного влево, то вправо, я же хочу чтобы она оставалась на месте. пхп код убираешь - вроде все нормально, но не всегда. Что делать? БОМ ни причем, я его отключил 0

@romchiksoad 1957 / 796 / 89 Регистрация: 03.11.2009 Сообщений: 3,066 Записей в блоге: 2
	28.11.2012, 13:27
	А код можно глянуть? Для начала тот, который передается браузеру. 0

@darkavenger1 1 / 1 / 1 Регистрация: 02.08.2012 Сообщений: 44
	28.11.2012, 18:42 [ТС]
	да оборачивал, не помогло) может блок какой-нибудь был больше ил что, не знаю) как только заполнил всю страницу, все встало на свои места 0

@darkavenger1 1 / 1 / 1 Регистрация: 02.08.2012 Сообщений: 44
	29.11.2012, 00:10 [ТС]
	Что-то я не понял куда ты тему увел. У меня все хорошо, мешало только смещение. Причем тут то, что ты сказал? 0