CSS for Wordpress Galleries

Hi everybody :slight_smile:

I’ve been trying to create my own wordpress themes for my own blog. However, I’m having problems creating a gallery. The problem is that the pictures won’t align with each other.

http://www.rhyswynne.co.uk/snow-pictures-of-north-wales-manchester/ (few swears on that page btw)

Any help would be greatfully appreciated :slight_smile:



You have random <br style=“clear: both;”> in between your dls.


Thanks, but that wasn’t the issue.

What fixed it (the fact that images were located on different lines) was no .gallery-item.

I stuck this in & It fixed it :slight_smile:

 .gallery-item {
				float: left;
				margin-top: 10px;
				text-align: center;
				width: 33%;			}
.gallery-item img {
				border: 2px solid #cfcfcf;
.gallery-item .gallery-caption {
				margin-left: 0;

Always solve these 3 seconds after admitting defeat :wink:

“Won’t align with each other” is different from “Won’t position one after another in the same line and wrap to the next line” :slight_smile:

There are a few ways to go about in this case, but you’re using dl lists in a wrong way :slight_smile: First off, they all should be in fact just one big dl, and you should have at least some dd elements in there too.

You don’t need the <br> to clear, you need a class, if even, for every 3rd image being the element for breaking the floats.

Paul O’B has an pretty good example for how to make these lists of images.

Lol, I’m not using DL’s the wrong way, Wordpress is :slight_smile:

I’m just trying to make it work with it (grr, grumble) - totally agree with you :slight_smile:

And sorry, I’m a little tired & sozzled from a long friday :smiley: