I have re-arranged your question a bit. As per srvani, you had to give us some show of effort from your side as the css does not help nothing at all -
That being said, the below is an example of what you are looking for.
JAVA
var searchButton = document.getElementById('submit'),
searchText = document.getElementById('search');
var items = [
{ text: 'Item 1', id: 'item1' },
{ text: 'Item 2', id: 'item2' },
{ text: 'Item 3', id: 'item3' },
{ text: 'Item 4', id: 'item4' }
];
function searchForItem(query) {
for (var i = 0; i < items.length; i++) {
if (items[i].text.indexOf(query) !== -1) {
return document.getElementById(items[i].id);
}
}
}
searchButton.addEventListener('click', function () {
var query = searchText.value,
item = searchForItem(query);
if (typeof item !== 'undefined') {
item.scrollIntoView();
}
});
HTML
<input id="search" type="text" placeholder="Type here"/>
<input id="submit" type="button" value="Search" />
<div id="item1" class="space">Item 1</div>
<div id="item2" class="space">Item 2</div>
<div id="item3" class="space">Item 3</div>
<div id="item4" class="space">Item 4</div>