центр ДИВ встроенный блок

У меня есть две дивыцентр ДИВ встроенный блок

<html> 
<head> 
    <title></title> 
<style type="text/css"> 
#div1 { 
    width: 45%; height: 500px; 
    margin-right:2.5%; 
    margin-top: 30px; 
    background-color: red; 
    display: inline-block; 
} 

#div2 { 
    width: 45%; height: 300px; 
    margin-right:2.5%; 
    margin-top: 30px; 
    background-color: blue; 
    display: inline-block; 

} 
</style> 
</head> 
<body> 
<div id="div1"></div> 
<div id="div2"></div> 
</body>

дает мне это

http://i.imgur.com/pQcHqfo.png

Как вы можете видеть, что мой второй (маленький) ДИВ находится на днище из другой, как я могу центрировать его вертикально.

Я пытался поставить их в другой DIV и использовать вертикальное выравнивание: minddle

источник

2015-05-03 shtyllat

В вашем вопросе у вас есть опечатка в значении 'middle'. Это в вашем фактическом коде? Также, если вы используете 'span', а не' div', вы получаете встроенный элемент, чтобы работать по вертикали. – minopret

Вам просто нужно добавить vertical-align: middle к обоим дивы и синий один будет отображаться вертикально по центру. См. Здесь: http://codepen.io/alexbaulch/pen/LVVqzG

источник

2015-05-03 11:16:07

Для использования в вертикальном направлении: середина; вам нужно установить отображение: встроенный или дисплей: встроенный блок, эти два идут вместе.

#div1 { 
 
    width: 45%; height: 500px; 
 
    margin-right:2.5%; 
 
    margin-top: 30px; 
 
    background-color: red; 
 
    display: inline-block; 
 
    vertical-align: middle; 
 
} 
 

 
#div2 { 
 
    width: 45%; height: 300px; 
 
    margin-right:2.5%; 
 
    margin-top: 30px; 
 
    background-color: blue; 
 
    display: inline-block; 
 
    vertical-align: middle; 
 
}

<div id="div1"></div> 
 
<div id="div2"></div>

источник

2015-05-03 11:17:43 odedta

центр ДИВ встроенный блок

ответ

Смежные вопросы