VPF::Выравнивание DIV по центру (vertical)

Opik

Дата 27.9.2006, 15:40 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Vingrad developer
Сообщений: 1918
Регистрация: 6.10.2004
Где: Рига

Репутация: нет
Всего: 55

У меня такая проблема. Мне не выравнить div по middle от другого дива.
Пробовал

Код


vertical-align: middle

не помогает, код ниже.
Что не так?

Код


<?xml version="1.0" encoding="windows-1251"?>
<!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>
<title>Game :)</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style media="screen" type="text/css">
<!--/*--><![CDATA[/*><!--*/
#hpBar
{
     width: 200px;
     float: left;
     background-image: url('../misc/hpbg.png');
     border: 1px #ccc solid;
}
/*]]>*/-->
</style>
<script language="javascript" type="text/javascript"><!--//--><![CDATA[//><!--

//--><!]]></script>
</head>
<body> 
        <div><div id="hpBar"><img src="image/misc/hp.png"  width="100" height="10" id="hpProccess"></div> [<span id="hp">1111</span>]</div>
</body>
</html>

Burrr

Дата 27.9.2006, 16:36 (ссылка)

(нет голосов)

Загрузка ...

Опытный

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

Репутация: 5
Всего: 20

В ДИВ-е такую штуку замутить не получится, вот такая неприятная особенность есть у ДИВа.
Всесто внешнего ДИВа нужно заюзать таблицу (к сожалению).

--------------------

JavaScript на fastcoder, sqlinfo.ru

Illuminaty

Дата 27.9.2006, 20:06 (ссылка)

(нет голосов)

Загрузка ...

/*Антон Захаров*/

Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56

При желании все можно smile

В данном случае код будет такой:

Код

<?xml version="1.0" encoding="windows-1251"?>
<!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>
<title>Game :)</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<style media="screen" type="text/css"><!--/*--><![CDATA[/*><!--*/
html, body {
    margin: 0px;
    padding: 0px;
    background-color: #FFFFFF;
}
body {
    overflow: auto;
}
#hpMain {
    height: 20px;
    line-height: 20px;
    background-color: #CCCCCC;
    font-size: 12px
}
#hpBar {
    float: left;
    width: 200px;
    background-color: #FFFF33;
    height: 10px;
    border: 1px solid black;
    margin: 4px 0px;
}
#hpProccess {
    height: 10px;
    width: 100px;
}
* html #hpMain span { /* IE hack */
    position: relative;
    bottom: 1px;
}
/*]]>*/--></style>
<script language="javascript" type="text/javascript"><!--//--><![CDATA[//><!--
//--><!]]></script>
</head>
<body> 
<div id="hpMain"><div id="hpBar"><img src="images/1.gif" alt="" id="hpProccess" /></div><span>[111]</span></div>
</body>
</html>

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