Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 10.01.2009, 17:17   #1
13th
Форумчанин
 
Аватар для 13th
 
Регистрация: 31.12.2008
Сообщений: 634
По умолчанию Верт. выравнивание текста в дивах

Народ. есть такая задачка - нужно выровнить текст по вертикали в блоке в диве.
Причем для адекватных браузеров я нашел рецепт
Код HTML:
display:table-cell; vertical-align: middle;
Но хорошо всем знакомый MSIE выкидывает номера
На каком-то сайте было предложено исппользовать display:inline-block with IE hack, but тьфу но не ужели нельзя без джавы добиться вертикального выравнивания в блоке для ИЕ?
И кстати за одно такой еще вопрос :
увидел в КСС стиле следующее
Код HTML:
<--!<if it IE>
дальше погнал код тех же самых классов , но с другими значениями
<end if>-->
Получается что такими комментами можно управлять разметкой взависимости от браузера клиента?
Возможно всё
Пишу обо всем
13th вне форума Ответить с цитированием
Старый 10.01.2009, 17:24   #2
wall66
Участник клуба
 
Аватар для wall66
 
Регистрация: 04.10.2008
Сообщений: 1,485
По умолчанию

эти условные комменты работают только для браузеров ие (ито не для всех неофициальных версий), другие браузеры полностью принимают их за html комментарии

вертикального выравнивание в дивах не знаю, можно заключить текст в блок и прописать у него margin:0px auto
свободен...
wall66 вне форума Ответить с цитированием
Старый 10.01.2009, 18:41   #3
13th
Форумчанин
 
Аватар для 13th
 
Регистрация: 31.12.2008
Сообщений: 634
Лампочка Возможно всё)))

Короче я ппокапался еще в паутине и нашел несколько решений, которые потом чуть модернизировал и вот пишу
ОГРОМНАЯ ПРОСЬБА - ПОСМОТРИТЕ КАК ВЕДЕТ СЕБЯ ТАКАЯ РАЗМЕТКА В:
FireFox до 3 версии
Opera до 8
ИЕ ниже 7
Код КСС
Код HTML:
div.primer {display:table; 
width:100%;
height:25em;

text-align:center;
}
div.context {display:table-cell;vertical-align:middle;
*position:relative;
*top:expression((this.parentElement.offsetHeight-this.offsetHeight)/2+'px');
}
А теперь сам ХТМЛ
Код HTML:
<div class="primer">
<div class="context">
Деньги - это, пожалуй, одно из наиболее великих изобретений человеческой мысли. В живой природе аналогий не найдётся. Вся структура современной экономики предопределена существованием денег. Деньги "родила" торговля, а поскольку торговля - одно из самых древних занятий человечества, то в старину уходят корни и денежной системы, хотя устройство её (как и вид самих денег) многократно и сильно меняется на протяжении истёкших тысячелетий. 
       На  самом  деле  деньги  не  такая  уж  и  простая  тема как показалось мне с первого взгляда. В  своей  работе  я  рассмотрел историческое  происхождение,  эволюцию  денежной  единицы  от  шкуры  до  смарт-карты, теории денег, функции  денег
</div>
</div>
А теперь комменты
1. Материал взять с http://shibaon.ru/node/638# , точнее его основа
2. При неизвестной высоте блока родителя и хотенье чтоб текст не прилипал к верхнему и нижнему краю отступы и рамки нужно вставлять в див-предок
3. Все это работает для выравнивания по центру
Для того что бы выравнивало по верху все эти правила не нужны
а вот для нижнего выравнивания
top:expression((this.parentElement. offsetHeight-this.offsetHeight)+'px');
З.Ы. Народ обязательно напишите как это работает в старых браузер и пожалуй самое интересное ка это работает в ИЕ8, о котором я только вчера узнал, если есть у кого
Возможно всё
Пишу обо всем

Последний раз редактировалось 13th; 11.01.2009 в 18:31.
13th вне форума Ответить с цитированием
Старый 10.01.2009, 19:17   #4
Bingam Vici
Форумчанин
 
Аватар для Bingam Vici
 
Регистрация: 28.12.2008
Сообщений: 145
По умолчанию

Ща задам оч.тупой вопрос (типа у меня есть IE, Opera, FireFox ток не знаю какие), где посмотреть версию? типа не я устанавливала, а так в свойствах не вижу
Bingam
Bingam Vici вне форума Ответить с цитированием
Старый 10.01.2009, 19:26   #5
13th
Форумчанин
 
Аватар для 13th
 
Регистрация: 31.12.2008
Сообщений: 634
По умолчанию

вообще я сам не заморачивайся на эту тему))) просто когда я устанавливаю что-то , то я знаю что конкретно
а так напиши в тексте страницы следующий код :
Код:
<script type="text/javascript">
document.write (navigator.appVersion);
</script>
Возможно всё
Пишу обо всем
13th вне форума Ответить с цитированием
Старый 10.01.2009, 19:28   #6
13th
Форумчанин
 
Аватар для 13th
 
Регистрация: 31.12.2008
Сообщений: 634
По умолчанию

нашел в файер фоксе
Справка--> o Mozilla FireFox и там будет написано версия
Ну а в остальных наверно аналогично
Возможно всё
Пишу обо всем
13th вне форума Ответить с цитированием
Старый 10.01.2009, 19:31   #7
Bingam Vici
Форумчанин
 
Аватар для Bingam Vici
 
Регистрация: 28.12.2008
Сообщений: 145
По умолчанию

нет, скажите мне! где узнать версию???!!! а то я ж не знаю
Цитата:
вообще я сам не заморачивайся на эту тему)))
ну сам, так сам
Bingam
Bingam Vici вне форума Ответить с цитированием
Старый 10.01.2009, 22:22   #8
13th
Форумчанин
 
Аватар для 13th
 
Регистрация: 31.12.2008
Сообщений: 634
По умолчанию

только сейчас увидел свою очепятку))))

Цитата:
вообще я сам не заморачивайся на эту тему)))
тут вообще-то хотел написать
вообще я сам не заморачивался на эту тему)))

так что просьба в силе
Возможно всё
Пишу обо всем
13th вне форума Ответить с цитированием
Старый 11.01.2009, 16:29   #9
Bingam Vici
Форумчанин
 
Аватар для Bingam Vici
 
Регистрация: 28.12.2008
Сообщений: 145
По умолчанию

А, ну тогды гляну
Bingam
Bingam Vici вне форума Ответить с цитированием
Старый 11.01.2009, 17:10   #10
Bingam Vici
Форумчанин
 
Аватар для Bingam Vici
 
Регистрация: 28.12.2008
Сообщений: 145
По умолчанию

Ух ты, узнала какие у меня версии браузеров, оказывается надо просто открыть Интернет и вверху нажать справку, а потом о программе, там, собственно, все и написано: и версия и все такое.
FireFox до 3 версии - у меня 5.0.
Opera до 8 - 9.26.
ИЕ ниже 7 - 6.0.2900 - а вот здесь, посмотрела.
Короче, вот с таким кодом:

Цитата:
<html>
<head>
<title>Стандартный документ HTML</title>
<meta http-equiv="Content-Type" content="text/html; Charset=windows-1251">
<meta name="Generator" content="HtmlReader v1.6"><STYLE>div.primer {display:table;
width:100%;
height:25em;
vertical-align:middle;
text-align:center;
}
div.context {display:table-cell;
*position:relative;
*top:expression((this.parentElement .offsetHeight-this.offsetHeight)/2+'px');
}
</STYLE>
</head><body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#FF0000">
<div class="primer">
<div class="context">
Деньги - это, пожалуй, одно из наиболее великих изобретений человеческой мысли. В живой природе аналогий не найдётся. Вся структура современной экономики предопределена существованием денег. Деньги "родила" торговля, а поскольку торговля - одно из самых древних занятий человечества, то в старину уходят корни и денежной системы, хотя устройство её (как и вид самих денег)
многократно и сильно меняется на протяжении истёкших тысячелетий.
</div>
</div>
</body>
</html>
Получилось вот шо

Оффтоп, 13 включи ЛС, шоб тут не позорилась
Изображения
Тип файла: jpg DiV.jpg (22.3 Кб, 125 просмотров)
Bingam

Последний раз редактировалось Bingam Vici; 11.01.2009 в 17:12. Причина: косяк
Bingam Vici вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Выравнивание текста, моргающий курсор alikon1 Общие вопросы Delphi 6 17.04.2009 00:41
Выравнивание искаженного текста RealKultura Общие вопросы C/C++ 0 19.12.2008 23:25
Выравнивание текста SeregaIRK Общие вопросы Delphi 4 21.07.2008 15:17
выравнивание текста по ширине Алёна Общие вопросы Delphi 6 18.04.2007 11:31