html - Centre div inside another -

i having trouble centering content of 1 div inside of because content doesn't appear.

#searchbkg {    postition: relative;    width: 100%;    height: 700px;    background-color: #85e085;  }  #searchcentre {    position: absolute;    width: 50%;    margin: 0 auto;  }

<div id="searchbkg">    <div id="searchcentre">test</div>  </div>

the green box appears there no text inside of it.

your text appearing fine, won't centered because have position: absolute; on inside div. change position: relative; , center horizontally. if need text centered within div, can apply text-align: center;.

#searchbkg {    position: relative;    width: 100%;    height: 700px;    background-color: #85e085;  }  #searchcentre {    position: relative;    width: 50%;    margin: 0 auto;    text-align: center;    border: 1px solid red;  }

<div id="searchbkg">    <div id="searchcentre">this centered div!</div>  </div>