高度为 100% 的固定 div 的相等缩进答案

【问题标题】：equal indentation for fixed div with height 100%高度为 100% 的固定 div 的相等缩进
【发布时间】：2014-06-14 23:01:37
【问题描述】：

我有问题。我需要 .gallery-window 底部、左侧、顶部、右侧的相同缩进 - 每个 20 像素。

<div id="gallery-popup">
<div class="shade"></div>
    <div class="gallery-window">
        <div class="gallery-description-container">
            <div class="close"></div>
            <h5>Кухня</h5>
            <p>Автор: <a href="#">janlight</a></p>
            <p>Дата публикации: <time datetime="2014-05-30">30 мая 2014</time></p>
            <div class="like-and-fav">
                <a href="#" class="main-topic-like"><span></span>27</a>
                <a href="#" class="main-topic-fav"><span>Добавить в избранное</span></a>
            </div>
            <div class="social-like">
                <a href="#" class="main-topic-twit"><span></span>14</a>
                <a href="#" class="main-topic-fb"><span></span>59</a>
                <a href="#" class="main-topic-vk"><span></span>8</a>
                <a href="#" class="main-topic-google"><span></span>4</a>
            </div>
        </div>
        <div class="gallery-img-container">
            <div class="gallery-img-wrapper">
                <img src="http://placehold.it/2200x1200" alt="">
            </div>
            <div class="gallery-prev-wrapper">
                <a href="#" class="prev-gallery"></a>
            </div>
            <div class="gallery-next-wrapper">
                <a href="#" class="next-gallery"></a>
            </div>
        </div>
    </div><!-- gallery-window -->

http://jsfiddle.net/7hqdN/1/

【问题讨论】：

标签： html css margin padding indentation

【解决方案1】：

对于 fixed 或 absolute 元素，您可以使用 coordonate 来调整元素的大小。

如果你从窗口的边框将坐标设置为20px，你会得到你想要的：http://jsfiddle.net/7hqdN/2/

.gallery-window {
    left: 20px;
    top: 20px;
    bottom:20px;
    right:20px;
    position: fixed;
    }

【讨论】：