Появление полоски на сервере. Отсутствие на компьютере. Блочная верстка в 3 колонки.

Появление полоски на сервере. Отсутствие на компьютере. Блочная верстка в 3 колонки.

Опции

Nitrex

Topic Starter сообщение

28.6.2011, 18:09; Ответить: Nitrex

Сообщение #1

0

Группа: User
Сообщений: 393
Регистрация: 11.4.2009
Поблагодарили: 0 раз
Репутация:

0

При просмотре страницы на Denwer появляется полоска в firefox5(в верху страницы)
На сервере: Линк
На компьютере: Линк
На данных скриншотах видно, что правый блок находится внизу, вместо своего законного места справа от информационного блока.
Код :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Голубой Парус - Главная страница</title>
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
<script type="text/javascript" src="script.js"></script>
</head>
<body>

<ul id='tab'>
<li class='mini_tab'> </li>
<li class='left_tab'> </li>
<li class='center_tab'> </li>
<li class='right_tab'> </li>
</ul>



<div id='body'>
<div id='left_menu'>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
</div>
<div id='center_menu'>
<div id='header'></div>
<div id='content'>
ЦЕНТРАЛЬНЫЙ БЛОК. МНОГО ТЕКСТА
</div>
</div>
<div id='right_menu'>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
</div>
</div>



<div id='footer'> </div>

</body>
</html>

ССS:
[CSS]
/* CSS Document */

html, body, div, span, applet, object, iframe, h1, h2,
h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym,
address, big, cite, code, del, dfn, em, font, img, ins,
kbd, q, s, samp, small, strike, strong, sub, sup, tt,
var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody, tfoot,
thead, tr, th, td
{
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

:focus { outline: 0; }

ins { text-decoration: none; }

del { text-decoration: line-through; }

table {
border-collapse: collapse;
border-spacing: 0;
}

/*------HEADER------*/

#tab {
margin-top:-95px;
height:100px;
}

#tab:hover {
margin-top:0px;
background-color:#0321a2;
}

#tab li{
margin-top:93px;
list-style-type:none;
float:left;
}

.mini_tab {
background-image:url(images/tab_b.png);
background-repeat:repeat-x;
width:70%;
}

.left_tab {
background-image:url(images/tab_l.png);
width:2%;
height:42px;
}

.center_tab {
background-image:url(images/tab_m.png);
width:26%;
height:42px;
}

.right_tab {
background-image:url(images/tab_r.png);
width:2%;
height:42px;
}

/*------BODY------*/

#left_menu {
margin-right:auto;
float:left;
width:15%;
}

#left_menu .widjet {
border: 1px solid #999999;
-moz-border-radius: 0 10px 10px 0;
-webkit-border-radius: 0 10px 10px 0;
border-radius: 0 10px 10px 0;
margin-bottom:30px;
}

#right_menu {
margin-right:auto;
width:15%;
float:right;
}

#right_menu .widjet {
border: 1px solid #999999;
-moz-border-radius: 10px 0 0 10px;
-webkit-border-radius: 10px 0 0 10px;
border-radius: 10px 0 0 10px;
margin-bottom:30px;
}

.widjet h3 {
font-weight:normal;
text-align:center;
font-family:Tahoma, Geneva, sans-serif;
padding:3px;
}

.widjet p {
font-size:14px;
font-family:"Courier New", Courier, monospace;
padding:5px;
border-top:1px solid #999999;
}

#center_menu {
margin:40px auto 0 auto;
width:65%;
border:1px solid #999;
-moz-border-radius:30px;
-webkit-border-radius:30px;
border-radius:30px;
height:500px;
}

#content {
margin:10px;
font-family:colibry;
font-size:14px;
}

/*------FOOTER------*/

#footer {
margin-top: 20px;
height:50px;
width:100%;
background-color:#0321a2;
}
[/CSS]

Помогите решить проблемы.

0

Ответить с цитированием данного сообщения

adlic adlic 28.6.2011, 18:15; Сообщений: 995 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	28.6.2011, 18:15; Ответить: adlic Сообщение #2
0 Группа: User Сообщений: 995 Регистрация: 5.8.2010 Поблагодарили: 0 раз Репутация: 0	#content обымает весь код? Если так, то margin:10px; вполне может стать причиной того отступа, сделайте margin:0 10px 10px 10px; #content { margin:10px; font-family:colibry; font-size:14px; } PS Еще можно попробовать [CSS]body{margin:0; padding:0;}[/CSS] или [CSS]{margin:0; padding:0;}/с этим осторожно*/[/CSS]

ValianT ValianT 28.6.2011, 18:17; Сообщений: 98 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	28.6.2011, 18:17; Ответить: ValianT Сообщение #3
0 Группа: User Сообщений: 98 Регистрация: 3.6.2011 Поблагодарили: 0 раз Репутация: 0	(Nitrex @ 28.6.2011, 21:09) [LIST] [*]При просмотре страницы на Denwer появляется полоска в firefox5(в верху страницы) На сервере: Линк На компьютере: Линк Очень и очень внимательно посмотри код. Можно source через браузер. Похоже на какой-то символ в начале листинга,который даёт такой отступ. (Nitrex @ 28.6.2011, 21:09) [LIST] На данных скриншотах видно, что правый блок находится внизу, вместо своего законного места справа от информационного блока. Код блоков: Правый и левый(код одинаковый, отличие только в id главного div-а. В правом: right_menu): покажи больше html. Наверно не туда вставил правую колонку. вот и поехало. лучше всю страницу или ссылку.

Nitrex Topic Starter NitrexTopic Starter 28.6.2011, 20:53; Сообщений: 393 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	Topic Starter 28.6.2011, 20:53; Ответить: Nitrex Сообщение #4
0 Группа: User Сообщений: 393 Регистрация: 11.4.2009 Поблагодарили: 0 раз Репутация: 0	Спасибо. Нашел косяк в коде, который генерирует html. Теперь осталось что-то сделать с колонками

Nitrex Topic Starter NitrexTopic Starter 29.6.2011, 12:10; Сообщений: 393 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	Topic Starter 29.6.2011, 12:10; Ответить: Nitrex Сообщение #5
0 Группа: User Сообщений: 393 Регистрация: 11.4.2009 Поблагодарили: 0 раз Репутация: 0	up. Помогите решить 1 проблемму

ValianT

30.6.2011, 13:23; Ответить: ValianT

Сообщение #6

0

Группа: User
Сообщений: 98
Регистрация: 3.6.2011
Поблагодарили: 0 раз
Репутация:

0

Ну собсно да.
правую колонку подтяни выше по коду.

<div id='body'>
<div id='left_menu'>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
</div>

<div id='right_menu'>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
<div class='widjet'>
<h3>Родителям</h3>
<p>бразование в «Голубом парусе» - это высокий уровень подготовки выпускников, подтверждающих знак «Алтын белгі»</p>
</div>
</div>

<div id='center_menu'>
<div id='header'></div>
<div id='content'>
ЦЕНТРАЛЬНЫЙ БЛОК. МНОГО ТЕКСТА
</div>
</div>

</div>

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой

или обратитесь к любому из модераторов.

« Предыдущая тема · Программная часть · Следующая тема »

1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)

Пользователей: 0

Похожие темы

Тема	Ответов	Автор	Просмотров	Последний ответ
Качественный современный дизайн сайтов, логотипов, печатной продукции. Верстка.	27	zaiko	17583	2.4.2024, 14:00 автор: zaiko
Верстка/Натяжка/Оптимизация/Увеличение функционала шаблонов на WP Разработка на профессиональном уровне	144	Gerga	92159	11.3.2024, 19:59 автор: anchous
Отсутствие мобильной версии сайта и влияние на выдачу	16	Lifelove	3612	29.1.2024, 23:09 автор: Liudmila
Верстка шаблона Битрикс	0	bat	1420	26.9.2023, 6:22 автор: bat
Верстка электронных писем бесплатно	0	Gidemopassan	1530	23.6.2023, 10:12 автор: Gidemopassan