Почему левый отступ не работает? - PullRequest
Новая
       1

Почему левый отступ не работает?

0 голосов
/ 24 декабря 2011

Я ожидал, что следующее поместит внутренний (красный) квадрат в позицию 50,50 в координатной рамке окна браузера. Но это не так. Почему? 

<body>
<div style="position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; background-color: yellow; padding: 50px;">
    <div style="position: absolute; left: 0px; right: 0px; width: 64px; height: 64px; background-color: red">
    </div>
</div>
</body>

Извините, мой сбой

Я хотел сделать "top: 0px" для внутреннего DIV, но вместо этого написал "right: 0px". Просто ошибка

Ответы [ 6 ]

3 голосов
/ 24 декабря 2011

position: absolute; выводит ваш элемент из нормального потока. Так как вы указываете, что он оставлен как 0, вот где он будет.

2 голосов
/ 24 декабря 2011

Ваша внутренняя div позиция absolute.попробуйте relative или не устанавливайте этот атрибут вообще.

0 голосов
/ 24 декабря 2011

Это была моя вина.Я хотел сделать top: 0px для внутреннего DIV, но вместо этого написал "right: 0px".Когда элемент двигался вниз, но не вправо, я решил, что верхний отступ обрабатывается иначе, чем слева.

0 голосов
/ 24 декабря 2011

левый правый верхний и нижний css означает «расстояние от».Он не предназначен для использования так, как вы его используете.

Вот лучший пример: http://jsfiddle.net/xAuLJ/

<body>
<div style="position: fixed; width:100%; height:100%; background-color: yellow;">
    <div style="position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin-top:-32px; margin-left:-32px; background-color: red">
    </div>
</div>
</body>
0 голосов
/ 24 декабря 2011

Из-за position: absolute; на красном квадрате.

Вы можете взять его и получить this , или установить свойство left и получить this .

Также, как примечание, некоторые люди предлагают (включая меня) не присоединять единицу измерения к свойству CSS, когда значение равно 0. Ноль чего-то еще равно нулю, поэтому 0px, 0emи т. д., не имеет значения, оно всегда равно 0.

0 голосов
/ 24 декабря 2011

Ну, это потому, что у вас position: absolute есть left: 0; Вы, вероятно, хотите что-то вроде этого: 

<body>

    <div style="position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; background-color: yellow; padding: 50px;">
        <div style="position: absolute; left: 50px; right: 0px; width: 64px; height: 64px; background-color: red">
        </div>
    </div>

</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...