Почему «#wd-2 { position: absolute; }» у меня отображается так как на скриншоте? Или конретнее почему margin жёлтого квадрата отсчитывается от начала 3 а не от конца 1(на скриншоте внизу видно)?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>title</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
#wd-c {
border: 1px solid blue;
}
#wd-c div {
height: 150px;
border: 1px solid #222;
font-size: 150%;
font-weight: bold;
opacity: .7;
}
#wd-1 {
background: red;
}
#wd-2 {
background: yellow;
}
#wd-3 {
background: lightblue;
}
#wd-c div { width: 150px; }
#wd-c div { display: inline; }
#wd-c div { display: block; }
#wd-2 { text-align: center; }
#wd-2 { display: inline; }
#wd-c #wd-2 { display: inline; }
#wd-c #wd-2 { display: block; }
#wd-c div { margin: 1em; }
#wd-c div { padding: 10px; }
#wd-c div { border: 2px dotted #000; }
#wd-2 { visibility: hidden; }
#wd-2 { visibility: visible; }
#wd-c #wd-2 { display: none; }
#wd-c #wd-2 { display: block; }
#wd-2 { position: absolute; }
</style>
</head>
<body>
<div id="wd-c">
<div id="wd-1"><span>1</span></div>
<div id="wd-2"><span>2</span></div>
<div id="wd-3"><span>3</span></div>
</div>
</body>
</html>
- То как оно отображается у меня.
- То как оно «должно быть». Видео от урока на 17:20, то есть там где у меня не сходится.
