Я хочу, чтобы красный квадрат точно перекрывал зеленый.
Все отлично работает в FF, IE и Opera, но в Chrome красный квадрат выравнивается по левому краю, а не по центру.
Кроме того, я могу влиять только на #parent div и его дочерние элементы, потому что я делаю закладку и не могу изменить другие элементы страницы.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title></title>
<style type="text/css">
#center { text-align: center; }
#parent {
position: absolute;
display: inline;
}
#nested {
background-color: #c00;
width: 280px !important;
height: 210px !important;
}
</style>
</head>
<body>
<div id="center">
<div id="parent"><div id="nested"></div></div>
<div style="display: inline-block; width: 280px; height: 210px; background-color: #0c0;"></div>
</div>
</body>
</html>
Пожалуйста, совет!
Когда я подробно остановился на свойствах Chrome, я обнаружил, что Chrome заставляет отображение блокироваться, когда вы устанавливаете абсолютное значение для #parent. Как сделать это встроенным?