css에 margin을 활용해서 다음과 같이 작성합니다.

#inner {
    width: 50%;
    margin: 0 auto; 
}

꼭 width : 50%;를 해야하는건 아니고요, 밖에 포함하는 <div>의 width보다 작은 수치이면 됩니다. margin: 0 auto;가 실제로 가운데 위치하도록 하는 속성값입니다.

만약에 IE8+을 대응한다면 아래와같이 처리하는 것이 좋습니다. 따로 width를 설정하지 않고, 다음과 같이 합니다.

#inner {
    display: table;
    margin: 0 auto;
}

flexbox를 이용하면 쉽게 할 수 있어요. http://ko.learnlayout.com/flexbox.html