Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Выровнять текст в строке по вертикали

Автор: Limonadni Joe 5.9.2006, 15:10

Строка содержит надпись и кнопку (или картинку — не важно). Кнопка выше, чем надпись. Как сделать так, чтобы обе они были выровнены относительно центра строки, а не по нижнему краю?

Автор: GIK 5.9.2006, 16:29

Что есть строка в твоем понимании?

Автор: skyboy 5.9.2006, 16:30

http://wdh.suncloud.ru/css06.htm#ref2672

Автор: Limonadni Joe 5.9.2006, 16:41

skyboy, Почему-то не работает. Можете дать пример?

Цитата(GIK @ 5.9.2006, 16:29

)

Что есть строка в твоем понимании?

<p></p> например

Автор: skyboy 5.9.2006, 17:10

<p> - это не строка. это контейнер. ты что хочешь вообще?

Автор: Limonadni Joe 5.9.2006, 17:19

Хочу, чтобы можно было вывести на экран надпись и кнопку так, чтобы их центры были на одной горизонтальной линии.

С таблицами парится не хочется.

Автор: R.M. 6.9.2006, 01:03

Limonadni Joe, ваш код в студию

Автор: skyboy 6.9.2006, 08:54

обознался. vertical-align, как я понял, для текста.

Автор: Limonadni Joe 6.9.2006, 16:04

Куксикус,

Код


<!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=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body>
    <p>Текст в строке<input type="button" value="Button" /></p>
</body>
</html>

Автор: UpL1nK 6.9.2006, 17:45

Код


<span style="vertical-align:text-bottom;">Текст в строке</span><input type="button" value="Button" />

Автор: Limonadni Joe 7.9.2006, 14:34

UpL1nK, У меня в шестом ИЕ надпись по прежнему внизу.

Автор: UpL1nK 7.9.2006, 14:53

Э, если по центру надо то

Код


<span style="vertical-align:middle;">Текст в строке</span><input type="button" value="Button" />

или еще можешь попробовать baseline

Автор: R.M. 7.9.2006, 21:11

UpL1nK, смотрел что получается?

Код


<!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=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
    <span style="vertical-align:absmiddle;">Текст в строке</span><input type="button" value="Button" />
</body>
</html>

Автор: UpL1nK 8.9.2006, 13:12

Куксикус, смотрел, все прекрасно
Кстати что такое absmiddle ?
Сам отвечу smile

Это выравнивание по центру относительно картинки, а где здесь картинка ?

Автор: Limonadni Joe 8.9.2006, 13:15

Куксикус, У меня надпись по прежнему не посередине.

Автор: UpL1nK 8.9.2006, 13:24

Limonadni Joe,
Куксикус,
сори парни у меня по умл. Опера, я даже не замечал что в ней смотрю.
Щас посмотрел в ИЕ действительно не робит, сори smile