高度为100%的固定div的等压痕

时间:2014-06-14 14:36:50

标签: html css margin padding indentation

我有问题。 我需要等级缩进.gallery-window bottom,left,top,right - 每个20px。

<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/

1 个答案:

答案 0 :(得分:0)

对于fixedabsolute元素,您可以使用坐标来调整元素的大小。

如果您从窗口边框设置坐标为20px,则可获得所需内容:http://jsfiddle.net/7hqdN/2/

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