html - CSS: position changing on changin resolution -
i making header website. have search box in header , search results should appear right below it. adjusted position of search results div when changed resolution of screen div moved away. have following code in html:
<div id = "header"> <div id = "header_wrapper"> <div id = "search_results"> </div> </div> </div>
and in css:
*{ margin:0px; } #header{ width:100%; border:1px solid #f1f1f1; height:100px; } #header_wrapper{ width:1000px; margin:auto; border:1px solid #f1f1f1; height:100px; } #search_results{ position:absolute; left:30%; height:100px; width:500px; border:1px solid #f1f1f1; top:100px; }
how can adjust div not change relative position it's parent div on changing screen resolution.please help
just replace css this, hope work want.
*{ margin:0px; } #header{ width:100%; height:100px; } #header_wrapper{ width:1000px; margin:auto; border:1px solid #000; height:100px; position:relative; } #search_results{ position:absolute; left:25%; height:100px; width:500px; border:1px solid #000; top:80px; }
Comments
Post a Comment