I cannot get my head around this:

 

http://rorymoore.com/test/?page_id=223

 

I want the pics to be centered on the screen.

 

Important: If you narrow the browser width ways the pics 'stack up' on top of each other. I want to keep this effect.

 

Thanks

 

 

css:

 

#grid-full-width {
float: left;
width: 100%;
height: auto;
}

#grid-gallery-wrapper {
position: relative;
width: 100%;
overflow: hidden;
float: left;
}

.with-filter {
margin-top: -40px;
}

.no-filter {
margin-top: -10px;
}

#grid-gallery {
position: relative;
width: 100%;
min-height: 400px;
margin-left: 40px; 
margin-top: 10px;
}

#gallery-container {
float: left;
width: 100%;
margin-bottom: 40px;
min-height: 500px;
}

Edited May 8, 201214 yr by Renaissance-Design
Please use the code button or tags to format your code.

I cannot get my head around this:

 

http://rorymoore.com/test/?page_id=223

 

I want the pics to be centered on the screen.

 

Important: If you narrow the browser width ways the pics 'stack up' on top of each other. I want to keep this effect.

 

Thanks

 

 

css:

 

#grid-full-width {

float: left;

width: 100%;

height: auto;

}

 

#grid-gallery-wrapper {

position: relative;

width: 100%;

overflow: hidden;

float: left;

}

 

.with-filter {

margin-top: -40px;

}

 

.no-filter {

margin-top: -10px;

}

 

#grid-gallery {

position: relative;

width: 100%;

min-height: 400px;

margin-left: 40px;

margin-top: 10px;

}

 

#gallery-container {

float: left;

width: 100%;

margin-bottom: 40px;

min-height: 500px;

}

 

Try adding:

 

div#grid-gallery.masonry {

min-width:1300px;

}

 

Or change the width to whatever you want, but fixing the container with a width usually helps

Try adding:

 

div#grid-gallery.masonry {

min-width:1300px;

}

 

Or change the width to whatever you want, but fixing the container with a width usually helps

 

Thanks Wayneio, I added this to the CSS but it didn't work. It didn't centralize the images and the stacking effect stopped working too.

 

Im new to coding so maybe I'm missing something?

Chew:

 

 

in

 

#gallery-container {
text-align:center;
display:table;
}

 

in

.content-box {
display:table-cell;
}

 

 

should do the trick

Edited May 8, 201214 yr by Renaissance-Design
Please use the code button or tags to format your code.

Chew:

 

 

in

 

#gallery-container {
text-align:center;
display:table;
}

 

in

.content-box {
display:table-cell;
}

 

 

should do the trick

 

Sorry. This didnt do anything.

 

Forget about it - Ive decided to keep it left aligned.

 

Thanks anyway.

If u can pack test page with js and css and send it to me i can work on it - if u want

snip

Edited May 9, 201214 yr by sash_oo7

If u can pack test page with js and css and send it to me i can work on it - if u want

 

Thanks for the offer to help but I've kinda moved on and am working on a new site. Im pretty new to all this and have new problems to resolve now!!