Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   правильно отцентрировать элементы относительно diva - родителя (https://javascript.ru/forum/xhtml-html-css/37599-pravilno-otcentrirovat-ehlementy-otnositelno-diva-roditelya.html)

torsar 26.04.2013 13:47

правильно отцентрировать элементы относительно diva - родителя
 
правильно отцентрировать элементы относительно diva - родителя?
http://jsfiddle.net/jSFHD/

и почему мой код не работает правильно?

ksa 26.04.2013 13:58

Цитата:

Сообщение от torsar
правильно отцентрировать элементы относительно diva - родителя?

Так правильно?

<!DOCTYPE html>
<html>
<head>
<!--
<script src="http://code.jquery.com/jquery-latest.js"></script>
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
.lbl {font-size: 200%}
.spn {padding-left: 5%}
.lbl, .spn, .lbl {vertical-align: middle;}
table {
    border-style: solid; width: 350px; height: 60px;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div>
	<table class="dv">
		<td>
			<input class="inpt" id="cbx" type="checkbox">
			<label class="lbl" for="cbx">CHEMISTRY</label>
			<span class="spn">60% Known</span>
		</td>
	</table>
</div>
</body>
</html>


Цитата:

Сообщение от torsar
и почему мой код не работает правильно?

Тебе важнее "почему" или таки "центрирование"? :)

torsar 26.04.2013 16:34

Цитата:

Тебе важнее "почему" или таки "центрирование"?
Вообщето я ожидал, что vertical-align центрирует чаилда относительно родителя
а он центрирует всех чаилдов относительно друг - друга
(хотя тоже полезная фича)
но не центрирует относительно родителя

ksa 26.04.2013 20:36

torsar, согласно документации
Цитата:

middle
Выравнивание средней точки элемента по базовой линии родителя плюс половина высоты родительского элемента.
http://htmlbook.ru/css/vertical-align


Часовой пояс GMT +3, время: 18:10.