Horizontally align images within a div

Question

Would like to horizontally align multiple images and have them flow down the page if there are too many. (This is a mini gallery in the middle of a wordpress post).

After trying multiple code variations found on this site, I still can not get it working. However it works fine at JSFiddle...

Links needed here here:

Working code at JSFiddle

Non-working code at my website (even though the exact same code is being used as above).

Is anyone able to assist me as to what's going wrong?

* HTML and CSS are evident in the first 'JSFiddle' link

* Using latest version of wordpress

PROBLEM SOLVED: (can't answer my own question for another 8hrs due to being new)

There is Auto Formatting and AutoText in wordpress that was automatically adding 'breaks' to the end of my image hyperlinks.

Added ".photographs br {display: none;}" to the CSS and it works fine!

Answer 1

You have <br> tags in between your images. Remove them and it will fix itself.

Answer 2

在您的代码中删除<br/> 。

Answer 3

PROBLEM SOLVED!

There is Auto Formatting or AutoText in Wordpress that was automatically adding <br /> to the end of my image hyperlinks.

Added .photographs br {display: none;} to the CSS , and it works a treat.