Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> элементы формы в div блоке. 
V
    Опции темы
EDuard
Дата 23.3.2006, 20:06 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 331
Регистрация: 1.8.2005
Где: Синее нигде

Репутация: 5
Всего: 7
Такая проблема.

Есть два див блока, в каждый вставляю рисунком кнопку (высота одинаковая), выравниваю кнопки по центру - высота блоков одинаковая, то что нужно.

Если в один из блоков вставляю две кнопки на одной линии то высота этого блока в IE увеличивается на 2px - кошмар! smile

Как можно решить проблему.


--------------------
PM MAIL WWW ICQ   Вверх
DemoCode
Дата 23.3.2006, 20:07 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 890
Регистрация: 20.10.2005
Где: Россия

Репутация: 3
Всего: 41
Цитата(EDuard @ 23.3.2006, 21:06 Найти цитируемый пост)
Как можно решить проблему.

А не пробовал явно задать высоту для блоков?


--------------------
Жить стало лучше, жить стало веселей
© И.В. Сталин 
PM MAIL ICQ   Вверх
EDuard
Дата 23.3.2006, 20:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 331
Регистрация: 1.8.2005
Где: Синее нигде

Репутация: 5
Всего: 7
DemoCode, пробовал. выравнять помогает, но некрасиво получается.
Такое чувство что у кнопки правило
Код

margin-bottom: 2px;

А у дива задан
Код

padding: 2px 10px; 


И получается 2+2=4px от нижнего края дива, а от верхнего только 2px.


--------------------
PM MAIL WWW ICQ   Вверх
Ciber SLasH
Дата 23.3.2006, 20:35 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 15
Всего: 67
Покажи код.
PM   Вверх
EDuard
Дата 23.3.2006, 21:08 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 331
Регистрация: 1.8.2005
Где: Синее нигде

Репутация: 5
Всего: 7
Код

...
<tr> 
<!-- LEFT COLUMN FOOTER-->
  <td>
    <div id="BborderL">
      <div class="border">
        <div class="BbuttonA">
           <input type="image" alt="" src="image/1.gif" name="1">
           <input type="image" alt="" src="image/2.gif" name="1">
        </div>
      </div>
    </div>
  </td>
<!-- END OF LEFT COLUMN FOOTER-->
<!-- RIGHT COLUMN FOOTER-->
  <td>
   <div id="BborderR">
     <div class="border">
        <div class="BbuttonA">
        <input name="Input" type="image" alt="" src="image/3.gif" title=""></div>
        </div>
      </div>
   </td>
<!-- END OF RIGHT COLUMN FOOTER-->
</tr>
...


Код

#BborderL {
    BORDER-RIGHT: #ffffff 1px solid;
    BORDER-BOTTOM: #ffffff 1px solid;
    BORDER-LEFT: #ffffff 1px solid;
    PADDING: 0px;
    MARGIN: 0px 1px 0px 0px;
    }

#BborderR {
    BORDER-RIGHT: #ffffff 1px solid;
    BORDER-BOTTOM: #ffffff 1px solid;
    BORDER-LEFT: #ffffff 1px solid;
    PADDING: 0;
    MARGIN: 0px 0px 0px 1px;
}
.border {
    BORDER: #999999 1px solid;
    BACKGROUND-COLOR: #ff9a66;
}
.BbuttonA {
    BORDER: #ffffff 1px solid;
    PADDING: 2px 15px;
    TEXT-ALIGN: center;
}
.BbuttonA input{
    margin: 0;
    padding: 0;
}



--------------------
PM MAIL WWW ICQ   Вверх
Ciber SLasH
Дата 23.3.2006, 21:42 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 15
Всего: 67
Что-то я не понял, а зачем вообще здесь DIV-ы если тут всё можно и без них сделать?
PM   Вверх
Bangladesh
Дата 23.3.2006, 21:44 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


AsBest
***


Профиль
Группа: Завсегдатай
Сообщений: 1089
Регистрация: 4.9.2004
Где: Калининград

Репутация: 4
Всего: 17
значится так:

Код

<!-- LEFT COLUMN FOOTER-->
  <td>
    <div id="BborderL">
      <div class="border">
        <div class="BbuttonA">
           <input type="image" alt="" src="image/1.gif" name="1"><input type="image" alt="" src="image/2.gif" name="1"></div>
      </div>
    </div>
  </td>
<!-- END OF LEFT COLUMN FOOTER-->


теги картинок поставить впритык и завершающий тег дива впритык к тегу картинки второй. расстояние между картинками придётся прописать с помощью паддингов и див-ов (опять же впритык все теги). или &nbsp; поставь.... это извечный гал IE.


--------------------
ок
PM MAIL WWW ICQ Skype   Вверх
EDuard
Дата 23.3.2006, 21:49 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 331
Регистрация: 1.8.2005
Где: Синее нигде

Репутация: 5
Всего: 7
2Ciber SLasH, дивами мне нужно нарисовать рамки и обеспечить 2-х пиксельный пробел между колонками.

2I, GyoZ, Спасибо! Помогло.

Это сообщение отредактировал(а) EDuard - 23.3.2006, 21:53


--------------------
PM MAIL WWW ICQ   Вверх
Ciber SLasH
Дата 23.3.2006, 22:17 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Эксперт
***


Профиль
Группа: Участник Клуба
Сообщений: 1813
Регистрация: 9.11.2004
Где: С.-Петербург

Репутация: 15
Всего: 67
Цитата(EDuard @ 23.3.2006, 21:49 Найти цитируемый пост)
2Ciber SLasH, дивами мне нужно нарисовать рамки и обеспечить 2-х пиксельный пробел между колонками.

Можно было бы уменьшить кол-во дивов:
Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content='text/html; charset=windows-1251'>
<meta name="Generator" content='EditPlus 2.21.330'>
<style type='text/css'>
.test {
    text-align: center;
}
.test td {
    border: 1px solid #999;
}
.test div {
    margin: 1px;
    padding: 2px 0;
    background: #FF9A66;
}
</style>
</head>

<body>
<table width="100%" style='border-collapse: collapse'>
<tr class='test'>
    <td>
    <div>
        <input type="image" alt="" src="image/1.gif" name="1">
        <input type="image" alt="" src="image/2.gif" name="1">
    </div>
    </td>
    <td>
    <div>
        <input name="Input" type="image" alt="" src="image/3.gif" title="">
    </div>
    </td>
</tr>
</table>
</body>
</html>
PM   Вверх
EDuard
Дата 24.3.2006, 13:59 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 331
Регистрация: 1.8.2005
Где: Синее нигде

Репутация: 5
Всего: 7
Ciber SLasH, Рамки так нарисовать можно, но я же писал:

Цитата(EDuard @ 23.3.2006, 21:49 Найти цитируемый пост)
обеспечить 2-х пиксельный пробел между колонками


посмотри мой пример в браузере, и все будет понятно.



--------------------
PM MAIL WWW ICQ   Вверх
  
 Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »

Подписаться на тему | Подписка на этот форум | Скачать/Распечатать тему


 




[ Время генерации скрипта: 0.0663 ]   [ Использовано запросов: 20 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
 По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.