Как убрать 1пиксельный отступ в Table???

@оля/1987 · Регистрация: 21.02.2009

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

Народ нужна помошь...!!!
Суть проблемы! Есть сайт который нужно сверстать. В двух правых ячейках должно быть изображение без отступов(как бы однородное) НО между ячейками таблици в которые помещены данные изображения появляется 1пиксельный отступ. Помогите его убрать

Code
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
[SIZE="1"]<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1251">
  <title>Группа компаний китеж</title>
  <link href="style.css" rel="stylesheet" type="text/css">
  </head>
  <body>
  <table class="main" border="0">
  
  <tr>
  <td class="head" colspan="2">
  <table class="main" border="0">
  
  <tr>
  <td><img src="image/head_kitej.jpg" border="0" width="375px" height="184px"></td>
  <td></td>
  </tr>
  
  </table>
  </td>
  <td class="skywindow1"><img src="image/top_right.jpg" width="283px" height="184px" botder="0"></td>
  </tr>
  
  <tr>
  <td>меню</td>
  <td>контент</td>
  <td class="skywindow2"><img src="image/right_windiw.jpg" width="283px" height="574px" border="0"></td>
  </tr>
  
  <tr>
  <td colspan="3">подвал</td>
  </tr>
  
  </table>
 
  </body>
</html>[/SIZE]

Code
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
[SIZE="2"]/*css*/
html, body {
           margin:0px;
         padding:0px;
}
table.main {
    width: 100%;
    height: 100%;
    border-collapse: collapse;
    background-color: #ffffff;
}
td.head{
    height:184px;
    }
td.skywindow1{
    width:283px;
    height:184px;
    vertical-align: top;
    }
td.skywindow2{
    background-image: url(image/right_window.jpg);
    width:184px;
    height:574px;
    border-collapse: collapse;
}
td {
    padding:0px;
    margin:0px;
}
img {
    margin:0px;
    padding:0px;
    border-collapse: collapse;
}[/SIZE]

Добавлено через 1 час 17 минут 48 секунд

кому не лень помогите

@GalaX · 25.02.2009, 09:48

@BlackApricot · 26.02.2009, 06:05

GаlаX-у от BlackApricot-а

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

Вот что у меня получилось, поправьте, если я тоже поспешил.

оля/1987-е от BlackApricot-а

Удалите:
border-collapse:collapse; - Зачем это при border="0"?
vertical-align:top; - Поднимаете содержимое ячейки вверх, и возмущаетесь! Правда в вашем случае, картинке некуда было подниматься.
<td class="skywindow1"><img src="image/top_right.jpg" width="283px" height="184px" boTder="0"></td> - Картинку из ячейки
height="184px", width="283px" - зачем тут "px", это Вам не CSS

Добавьте:
td.skywindow1 { background-image: url(image/top_right.jpg); .....}
<td> </td> - Этот пробел или текст, иначе ослик ее выделит
<td class="skywindow1"> </td> - Этот пробел или текст, иначе ослик ее выделит

Что это было:
Браузер ставит картинку, как текст, выравнивая ее низ по текстовой строке, и тот зазор, это место где рисуются "хвостики" букв "у", "р" и других. Кстати, там не один пиксель, а больше.

Скачайте себе нормальный редактор, тут есть и халявная версия.
htmlvalidator.com

@оля/1987 · 27.02.2009, 12:37 **[ТС]**

Большое спасибо что прояснили такие моменты приму на заметку)
Проблема решилась сама собой "при резке" картинок случайно был отрезан 1 пиксель бекграунда.
Еще если не трудно подкиньте статеек по оформлению CSS форм без помощи таблиц. На данном этапе интерисуют формы авторизации.Код пока что пишется без доктайпа. Почитала статью на htmlbook не ставится картинка <input type="image" src="">.
Спасибо за внимание

@Alto · 27.02.2009, 15:14

Чтобы убрать совсем расстояние между ячейками создай стиль для таблицы, в нем укажи параметр border-collapse со значением collapse.

@Ceran · 27.02.2009, 15:57

В каком смысле не ставится?

@GalaX · 28.02.2009, 00:01

Сообщение от оля/1987

Код пока что пишется без доктайпа.

а зря

@оля/1987 · 28.02.2009, 14:30 **[ТС]**

GаlаX почему зря?верстка табличная с таблицами до 3го уровня резиновая... думаю даже на HTML 1.0 все без багов будет.
В форме не ставится в место

HTML5
1
<input type="submit">

изображение в виде кнопки отправки в обработчик
читал что можно поставить тип имейдж и в src указать путь к изображению но вместо изображения выводится только параметр alt.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<form action="/users/" method="post">
   <table border="0" cellspacing="0" cellpadding="2">
   <tr>
   <td class="form1">Логин:</td>
   <td><input name="user_login" type="text" size="10"></td>
   </tr>
   <tr>
   <td class="form1">Пароль:</td>
   <td><input name="user_password" type="password" size="10" maxlength="10" value=""></td></tr>
   <tr>
   <td colspan="2" align="left"><input name="apply" type="submit" maxlength="10" value="Вход"/></td>
   </tr>
   </table>
   </form>

Добавлено через 59 минут 12 секунд
Столкнулся с проблемой после вставки в хтмл доктайпа 4.01 трансишнал...
ослик и опера отказываются осображать вложенную таблицу на 100% высоты ячейки. Чтобы прйсти валидацию убрал все в CSS но результата нет параметр height=100% игнорируется. В итоге вложенная таблица отображается middle а ширина как не странно 100%. ПОпытался найти статьи.... понял только то что нужно задавать стилевые правила как для вложенной таблицы так и для её контейнера...
КОнтейнер шириной 300px а так как таблица резиновая то высота не задавалась.
ТАк вот как мне описать height и для контейнера и для таблицы?

@Ceran · 28.02.2009, 19:19

height в процентах не поддерживается. Только абсолютные значение - px. Ставишь, к примеру, height: 300px; - получаешь высоту в 300px, если твои данные превышают это значение - высота будет увеличена автоматически.
middle - это позиционирование данных внутри таблицы, в данном случае посередине относительно верха и низа (но не право - лево!) Чтобы отформатировать элемент по высоте используется vertical-align: [top, middle, bottom];

А с картинкой вместо кнопки тут ты просто сам невнимателен.
Вот твой код. Картинка в данном случае должна находиться в том же каталоге, что и html-файл.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<form action="/users/auch.php" method="post">
<table border="0" cellspacing="0" cellpadding="2">
      <tr>
         <td class="form1">Логин:</td>
         <td><input name="user_login" type="text" size="10" maxlength="10"></td>
      </tr>
      <tr>
         <td class="form1">Пароль:</td>
         <td><input name="user_password" type="password" size="10" maxlength="10"></td></tr>
      <tr>
         <td colspan="2" align="left"><input type="image" name="apply" src="imgbutton.gif" alt="Вход"></td>
      </tr>
</table>
</form>

Больше ничем помочь не могу, Оля ты наша

@оля/1987 · 01.03.2009, 01:10 **[ТС]**

Ceran так с абсолютными значениями все понятно) с кнопкой разобрался с вашей помошью)
Еще одна проблема. В контейнере тобишь в ячейке куда помещена вложенная таблица в осле и опере она позицианируется по центру(значение по умолчанию),
но как бы я не кочевряжился и не писал стилевые правила этому контейнеру вложенная таблица все равно стоит по центру.Как нужно плясать с бубном чтобы этот элемент встал куда нужно? вместо вложенной таблици ставил дивы но результат не на лицо а на больную голову. Чегож не так то?

@Ceran · 01.03.2009, 02:29

Уважаемый Оля

так сложно сказать, хотя, думаю, что примерно понимаю о чём речь. Короче - говоря, закатай всё в архив и дай ссылку. Или тут опубликуй код. Потому как на расстоянии даже на пальцах объяснить не получится.

@оля/1987 · 01.03.2009, 13:29 **[ТС]**

Ceran да я просто с подругиного аккаунта сижу)
А в опзицианировании разобрался) Изза того что верхние 2 ячейки были colspan то ячейки под ними не мог стилизовать видимо особенность спецыфикации. Пришлось задавать правила для столбцов tr. Подобного описания встречал в интернете мало так что додумал методом проб и ошибок. Какие стилевые правила можно задать для ссылок кроме

HTML5
1
2
3
4
5
6
7
8
9
a:link {
    color: #0f3b82;
}
a:visited{
    color:#0f3b82;
}
a:hover {
    color: #0018ca;
   }

@Ceran · 01.03.2009, 14:50

Тебе сюда

@Axel2 · 07.03.2009, 10:06

Сообщение от оля/1987

Большое спасибо что прояснили такие моменты приму на заметку)
Проблема решилась сама собой "при резке" картинок случайно был отрезан 1 пиксель бекграунда.
Еще если не трудно подкиньте статеек по оформлению CSS форм без помощи таблиц. На данном этапе интерисуют формы авторизации.Код пока что пишется без доктайпа. Почитала статью на htmlbook не ставится картинка <input type="image" src="">.
Спасибо за внимание

Поищите в интернете (или в ближайшем книжном магазине) Мухамметов Г.В. "HTML и CSS Самоучитель. Верстку на <div> и CSS я по нему осваивал.

@оля/1987 · 07.03.2009, 18:00 **[ТС]**

НАрод еще вопрос. Есть страница с шапкой контентом и подвалом. В контенте слева хочу разместить меню на дивах. В контент вписал 2 дива... меню и сам контент. Блоку с меню задал float. В див подготовленный для меню вставил еще 2 дива с назначенными изображениями в виде бекграунда.Вопщем суть в том что когда я убираю у блока бордер то фоновое изображение сьезжает вниз а блок остается на месте. Как с этим бороться?

@Axel2 · 14.03.2009, 05:15

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

height в процентах не поддерживается. Только абсолютные значение - px.

Насчёт таблиц не знаю, а вот в дивах вполне отображается.... Правда, с непредсказуемым результатом... Но, для <div> вполне реально задать height:100%;(CSS). И посмотреть, что же из этого получится. Но, процентов 70%, что кроссбраузерности с такими замашками не будет

@Ceran · 14.03.2009, 13:41

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

Насчёт таблиц не знаю, а вот в дивах вполне отображается.... Правда, с непредсказуемым результатом... Но, для <div> вполне реально задать height:100%;(CSS). И посмотреть, что же из этого получится. Но, процентов 70%, что кроссбраузерности с такими замашками не будет

Тогда какой смысл с этим заморачиваться, если кроссбраузерности не получится? Или ты предлагаешь писать CSS под каждый браузер?

ИМХО: это идиотизм.
Есть стандарты описанные w3org, вот их и надо придерживаться. Иначе будет бардак. Завтра какой-нить Вася напишет очередной браузер со своими собственными стандартами. И чё мы будем делать? Подстраивать под него сайты только потому что он поленился изучить стандарты, которых должна придерживаться его программа?
Я конечно утрирую, но смысл именно в этом.

@alexeymeek · 07.12.2012, 19:41

Картинки - это строчные элементы html, а между строками по умолчанию зазор. В стилях к параграфу (блоку) display: inline;...

Новые блоги и статьи Все статьи Все блоги /
Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .	SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer 8Observer8 08.02.2026 Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .	SDL3 для Web (WebAssembly): Основы отладки веб-приложений на SDL3 по USB и Wi-Fi, запущенных в браузере мобильных устройств 8Observer8 07.02.2026 Содержание блога Браузер Chrome имеет средства для отладки мобильных веб-приложений по USB. В этой пошаговой инструкции ограничимся работой с консолью. Вывод в консоль - это часть процесса. . .	SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .
Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .	SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .

@GalaX 701 / 573 / 59 Регистрация: 18.11.2008 Сообщений: 2,147
	25.02.2009, 09:48
	<table cellspacing="0"> 2

@BlackApricot 288 / 131 / 4 Регистрация: 15.02.2009 Сообщений: 520
	26.02.2009, 06:05
	GаlаX-у от BlackApricot-а Куда Вы спешите? тут все гораздо интересней, если б Вы не спешили, то заметили бы, что вопрос от барышни, а женская логика страшная вещь... Вот что у меня получилось, поправьте, если я тоже поспешил. оля/1987-е от BlackApricot-а Удалите: border-collapse:collapse; - Зачем это при border="0"? vertical-align:top; - Поднимаете содержимое ячейки вверх, и возмущаетесь! Правда в вашем случае, картинке некуда было подниматься. <td class="skywindow1"><img src="image/top_right.jpg" width="283px" height="184px" boTder="0"></td> - Картинку из ячейки height="184px", width="283px" - зачем тут "px", это Вам не CSS Добавьте: td.skywindow1 { background-image: url(image/top_right.jpg); .....} <td> </td> - Этот пробел или текст, иначе ослик ее выделит <td class="skywindow1"> </td> - Этот пробел или текст, иначе ослик ее выделит Что это было: Браузер ставит картинку, как текст, выравнивая ее низ по текстовой строке, и тот зазор, это место где рисуются "хвостики" букв "у", "р" и других. Кстати, там не один пиксель, а больше. Скачайте себе нормальный редактор, тут есть и халявная версия. htmlvalidator.com 2

@оля/1987 0 / 0 / 1 Регистрация: 21.02.2009 Сообщений: 20
	27.02.2009, 12:37 [ТС]
	Большое спасибо что прояснили такие моменты приму на заметку) Проблема решилась сама собой "при резке" картинок случайно был отрезан 1 пиксель бекграунда. Еще если не трудно подкиньте статеек по оформлению CSS форм без помощи таблиц. На данном этапе интерисуют формы авторизации.Код пока что пишется без доктайпа. Почитала статью на htmlbook не ставится картинка <input type="image" src="">. Спасибо за внимание 0

@Alto 5 / 5 / 3 Регистрация: 12.12.2008 Сообщений: 50
	27.02.2009, 15:14
	Чтобы убрать совсем расстояние между ячейками создай стиль для таблицы, в нем укажи параметр border-collapse со значением collapse. 0

@Ceran 172 / 101 / 10 Регистрация: 22.02.2009 Сообщений: 440
	27.02.2009, 15:57
	В каком смысле не ставится? 0

@оля/1987 0 / 0 / 1 Регистрация: 21.02.2009 Сообщений: 20
	01.03.2009, 01:10 [ТС]
	Ceran так с абсолютными значениями все понятно) с кнопкой разобрался с вашей помошью) Еще одна проблема. В контейнере тобишь в ячейке куда помещена вложенная таблица в осле и опере она позицианируется по центру(значение по умолчанию), но как бы я не кочевряжился и не писал стилевые правила этому контейнеру вложенная таблица все равно стоит по центру.Как нужно плясать с бубном чтобы этот элемент встал куда нужно? вместо вложенной таблици ставил дивы но результат не на лицо а на больную голову. Чегож не так то? 0

@Ceran 172 / 101 / 10 Регистрация: 22.02.2009 Сообщений: 440
	01.03.2009, 02:29
	Уважаемый Оля так сложно сказать, хотя, думаю, что примерно понимаю о чём речь. Короче - говоря, закатай всё в архив и дай ссылку. Или тут опубликуй код. Потому как на расстоянии даже на пальцах объяснить не получится. 0

@Ceran 172 / 101 / 10 Регистрация: 22.02.2009 Сообщений: 440
	01.03.2009, 14:50
	Тебе сюда 0

@оля/1987 0 / 0 / 1 Регистрация: 21.02.2009 Сообщений: 20
	07.03.2009, 18:00 [ТС]
	НАрод еще вопрос. Есть страница с шапкой контентом и подвалом. В контенте слева хочу разместить меню на дивах. В контент вписал 2 дива... меню и сам контент. Блоку с меню задал float. В див подготовленный для меню вставил еще 2 дива с назначенными изображениями в виде бекграунда.Вопщем суть в том что когда я убираю у блока бордер то фоновое изображение сьезжает вниз а блок остается на месте. Как с этим бороться? 0

@alexeymeek 0 / 0 / 0 Регистрация: 07.12.2012 Сообщений: 9
	07.12.2012, 19:41
	Картинки - это строчные элементы html, а между строками по умолчанию зазор. В стилях к параграфу (блоку) display: inline;... 0