Making center a inline-block

Question

I am having a hard time centering a inline block.

.content {
    width: 85%;
    margin: 0 auto;
}

#main-wrapper {
    text-align: center;
    display: inline-block;
}

#main-column {
    width: 85%;
    margin: 0 auto;
}

#image {
    width: 150px !important;
    height: 150px !important;
}

HTML

@foreach($estates as $estate)
    <div id="main-wrapper">
         <div id="main-column">
               <div class="sub-column">
                    <img id="image" src="{{$estate->image}}">
               </div>
               <div class="sub-column">
                    Content
               </div>
               <div class="sub-column">
                    Buttons
               </div>
         </div>
     </div>
@endforeach

I don't want to make center element's inside sub-columns image and text etc. Just want to make a center main-column. This is the image of the page

Answer 1

Inline blocks works like if they were words of text, use text-align: center on the parent and it will center the line.

#main-wrapper {
  text-align: center;
}

I'm not really sure why are you using inline blocks, if you just want #main-column to be centered, use:

#main-column {
  width: 85%;
  margin: 0 auto;
  // note there's no display: inline-block here
}

Answer 2

It's hard to be certain without seeing the surrounding code, but try moving the #main-wraper and #main-column elements out of the @foreach loop.

<div id="main-wrapper">
    <div id="main-column">
        @foreach($estates as $estate)
            <div class="sub-column">
                <img id="image" src="{{$estate->image}}">
            </div>
            <div class="sub-column">
                Content
            </div>
            <div class="sub-column">
                Buttons
            </div>
        @endforeach
    </div>
</div>

Be aware that an id attribute is supposed to be a unique value on the page. #image is currently not unique if there's more than one $estate . Consider using a class attribute on the <img> elements instead.