Полная ширина галереи с масонством

Я только что основал эту потрясающую галерею и внедрил ее, но у меня один вопрос. Можно ли сделать его полной шириной на обеих сторонах окна и без пробелов между изображениями? Я считаю, что это css, который мне нужно изменить.Полная ширина галереи с масонством

#content { 
    /*width: 980px;*/ 
    /*width: 95%;*/ 
    width: auto; 
    margin: 0 auto; 
    margin-top: 50px; 
} 

.item { 
    display: block; 
    float: left; 
    width: 300px; 
    margin: 0 20px 20px 0; 
    -webkit-transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
    -moz-transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
    -ms-transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
    -o-transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
    transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
} 

.featured { 
    width: 620px; 
} 

.item img { 
    width: 300px; 
    height: auto; 
} 

.featured img { 
    width: 620px; 
    height: auto; 
}

Это HTML часть

<body> 
<div id="content" class="container clearfix"> 

<div class="item"> 
    <img src="img/single-1.jpg" alt="" /> 
</div> 

<div class="item"> 
    <img src="img/single-2.jpg" alt="" /> 
</div> 

<div class="item featured"> 
    <img src="img/double-1.jpg" alt="" /> 
</div> 
</div> 
</body>

JSFIDDLE of what is look like now

источник

2015-04-20 John

использование JsFiddle для вставки код/демо, –

Спасибо за комментарий. Вот jsfiddle - https://jsfiddle.net/e6yy4v8r/ – John

Вам нужно ссылаться на кладку js в скрипте - но измените это: 'margin: 0 20px 20px 0;' на этот «margin: 0;» в '.item', и он должен это сделать –

Изменить ваш CSS:

#content { 
/*width: 980px;*/ 
/*width: 95%;*/ 
width: 100%; /* <-- change to 100% */ 
margin: 0 auto; 
margin-top: 50px; 
} 

.item { 
display: block; 
float: left; 
width: 300px; 
/*margin: 0 20px 20px 0;*/ /* comment out or remove this line */ 
-webkit-transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
-moz-transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
-ms-transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
-o-transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
transition: left .4s ease-in-out, top .4s ease-in-out .4s; 
}

Its добавляющие маржинальные/пробельные/пробелы

источник

2015-04-20 11:31:47

Таким образом, он удаляет только пространство, но не делает полную ширину на странице. – John

Я пытаюсь добиться чего-то подобного: -http: //www.studiox.bg/bg/portfolio – John

@John Вам нужно что-то вроде. https://jsfiddle.net/e6yy4v8r/5/ – ketan

Полная ширина галереи с масонством

ответ

Смежные вопросы