TileGallery Width Centering problem

hello n3v3rm1nd

Would it be possible for you to post the web address so we can see the problem your talking about? It would really help.

oh yeah sorry ! emotionspix.de

static page on the homepage and other one are affected by this

I am sorry, I don’t understand what you mean by “expand the widht of the jetpack tile gallery”.

If I understand what you want I can tell you how to do it and where to add the code.

the tile gallery is not wide enough .. i expanded it to 1500px but now everything is not centered .. see for yourself .. link is in the post above you

Here you go

#content {
    margin: 0 0 0 -10%;
    width: 1500px;
}

You expanded the width of the image to a size wider than the base width of the site. Use the above code and you will get your images centered again.

yeah ! fixed it .. i fiddled with the margin but no way that i could fix it ! ?? thanks !

Not a problem.

Happy to help.

For all I care, there is no tile gallery at https://emotionspix.de

I assume you do not have the time to wait for me to learn Deustche, in order to help you.

Anyway, I suppose you meant the tile gallery @ https://emotionspix.de/portfolio/.

In your child theme’s style.css, replace last line #content{width:1500px;}
with

.page-id-41 .container { width: 100%; overflow-x: hidden; }
.page-id-41 #content { width: 98%; }
.page-id-41 .breadcrumbs { margin-left: 20px; }

Can’t test it higher than 1440px wide here, but should be ok.

@michael Smith: this is a responsive theme. Please make a habit of re-sizing the browser window before submitting a CSS solution. Also, keep in mind that a website having both horizontal and vertical scrolls is generally considered a bad practice.

not centered with this …

#content{width:1500px;} should not be visible i assume ..

and the problem with this is that its no longer responsive

#content {
    margin: 0 0 0 -10%;
    width: 1500px;
}

but acts as a quick fix ! ??

Did you try acub’s suggestion?

yeah thats when i said that everything works fine but the centering

Sorry, wasn’t able to test it on widths larger than 1440px until now. Add this to the CSS I mentioned above:

.page-id-41 .tiled-gallery { margin: 0 auto; display: inline-block; }
.page-id-41 .entry-content { text-align: center; }

I also noticed another small problem @ widths under 767px. You need to add this too:

@media (max-width: 767px) {
	.page-id-41 #content { width: 100%; }
	.page-id-41 #main-wrapper { padding: 0; }
}

wow you are a really great person ! thank you very much ! i hope other people get helped by this thread too ! ??