article

Re: margin-top

От:	c-smile	http://terrainformatica.com
Дата:	09.03.08 18:22
Оценка:	8 (1)

Здравствуйте, ShaggyOwl, Вы писали:

SO>Привет!

SO>Есть два вложенных один в другой дива. Если второму указать margin-top: 10px; то он не смещается относительно первого. Если для него определить border, то смещается. Это баг или фича?
SO>3.2.2.10

Это называется margin collapsing.

http://www.w3.org/TR/CSS21/box.html#collapsing-margins

The top margin of an in-flow block-level element is adjoining to its first in-flow block-level child's top margin if the element has no top border, no top padding, and the child has no clearance

Пользуй например вот:

.box
    {
        clear:both;
    }

margin-top

	От:	ShaggyOwl	http://www.htmlayoutlab.com
	Дата:	09.03.08 17:15

Привет!

Есть два вложенных один в другой дива. Если второму указать margin-top: 10px; то он не смещается относительно первого. Если для него определить border, то смещается. Это баг или фича?
3.2.2.10

Код примера здесь

<html>
<head>
<style>
    .scroll-left-cell
    {
        background-image: url(grating.png);
        height: 41px; width: 67px;
        //border: 1px solid red;
    }
    .box
    {
        margin-top: 10px;
        background-image: url(box.png);
        background-repeat: no-repeat;
        height: 20px;
        width: 20px;
        margin-left: 10px;
    }
    #second
    {
        border: 1px solid red;
    }

</style>

</head>
<body>
    <div style="flow: horizontal;">
        <div .scroll-left-cell>
            <div .box #first />
        </div>

        <div .scroll-left-cell>
            <div .box #second />
        </div>
    </div>
</body>

</html>

When in doubt — use bruteforce. Ken Thompson

Re[2]: хмм...

	От:	c-smile	http://terrainformatica.com
	Дата:	09.03.08 20:31

Здравствуйте, c-smile, Вы писали:

SO>>Есть два вложенных один в другой дива. Если второму указать margin-top: 10px; то он не смещается относительно первого. Если для него определить border, то смещается. Это баг или фича?
SO>>3.2.2.10

CS>Это называется margin collapsing.

Что-то мне говорит что я напутал чего-то.
margins между flow:horizontal и flow:vertical не должны колапсировать.

Поправлю.

Re[3]: хмм...

	От:	ShaggyOwl	http://www.htmlayoutlab.com
	Дата:	09.03.08 21:08

Здравствуйте, c-smile, Вы писали:

CS>Что-то мне говорит что я напутал чего-то.
CS>margins между flow:horizontal и flow:vertical не должны колапсировать.

Спасибо

When in doubt — use bruteforce. Ken Thompson