Having trouble centering elements on website

Question

I was working on a personal website for someone, and I came across an issue centering his portfolio section on his page. The concerned page can be viewed at http://websitetesting.pro/portfolio.html , my website for testing purposes. The portfolio images are under the "figure" tag, but the problem should be under the class "rowone", as that's the parent element to the figure images. Here's the code for row one.

.rowone {
    height:240px;
    margin-left: 25%;
    margin-right: 25%;
    line-height: 240px;
    text-align: center;
    margin: auto;
}

If not in there, the error should be somewhere in either the "main" css, or the "portfolio" css which refers directly to the portfolio page.

Answer 1

The .column class is a block element which it fills the whole page by width. When set to inline block it retains a certain width and it can be moved around.

.column {
    display: inline-block;
}

or

hover01 {
 display: inline-block;
    }

options 2 is better. SO you wouldn't target a general class

Answer 2

.rowone {
    height: 240px;
    line-height: 240px;
    text-align: center;
    display: table;
    margin: 0 auto;
}